How do I extend this script?

[sonnieboy]

<script type="text/javascript">
    function validate() {
        var checkbox = document.getElementById("<%=grid1Details.ClientID %>");
        var txtsourcename = $("[id*='txtsourcename']")[0];
        var txtsourceaddress = $("[id*='txtsourceaddress']")[0];
        var txtsourceincome = $("[id*='txtsourceincome']")[0];

        //spouse check
        checkbox = document.getElementById("<%=spouseDetails.ClientID%>");
        var txtspousename = $("[id*='txtspousename']")[0];
        var txtspouseaddress = $("[id*='txtspouseaddress']")[0];
        var txtspouseincome = $("[id*='txtspouseincome']")[0];

        if (checkbox.checked) {
            if ($(txtsourcename).val().length != 0 && $(txtsourceaddress).val().length != 0 && $(txtsourceincome).val().length != 0) {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            } else {
                return true;
            }
        } else {
            if ($(txtsourcename).val().length != 0 && $(txtsourceaddress).val().length != 0 && $(txtsourceincome).val().length != 0) {
                return true;
            } else {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            }
        }
      //spouseDetails
        if (checkbox.checked) {
            if ($(txtspousename).val().length != 0 && $(txtspouseaddress).val().length != 0 && $(txtspouseincome).val().length != 0) {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            } else {
                return true;
            }
        } else {
            if ($(txtspousename).val().length != 0 && $(txtspouseaddress).val().length != 0 && $(txtspouseincome).val().length != 0) {
                return true;
            } else {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            }
        }
    }
   </script>


//click button:
      <td> <asp:Button ID="btnNext" CssClass="btnNext" runat="server" Text=" Review Form " OnClientClick="BtnClick(); return validate()" OnClick="btnNext_Click" /></td>

<script type="text/javascript">
    function validate() {
        var checkbox = document.getElementById("<%=grid1Details.ClientID %>");
        var txtsourcename = $("[id*='txtsourcename']")[0];
        var txtsourceaddress = $("[id*='txtsourceaddress']")[0];
        var txtsourceincome = $("[id*='txtsourceincome']")[0];

        //spouse check
        checkbox = document.getElementById("<%=spouseDetails.ClientID%>");
        var txtspousename = $("[id*='txtspousename']")[0];
        var txtspouseaddress = $("[id*='txtspouseaddress']")[0];
        var txtspouseincome = $("[id*='txtspouseincome']")[0];

        if (checkbox.checked) {
            if ($(txtsourcename).val().length != 0 && $(txtsourceaddress).val().length != 0 && $(txtsourceincome).val().length != 0) {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            } else {
                return true;
            }
        } else {
            if ($(txtsourcename).val().length != 0 && $(txtsourceaddress).val().length != 0 && $(txtsourceincome).val().length != 0) {
                return true;
            } else {
                jAlert("Please enter values on all textboxes or check the checkbox next to each textbox.");
                return false;
            }
        }
     }
   </script>

The following script allows user to either fill out the textboxes in any particular gridview control with a checkbox called grid1Details.

 

If the user chooses not to fill out the textboxes, then the user must check the grid1Details checkbox in other to submit the form.

 

In other words, it is EITHER /OR.

 

This works great.

 

The issue I have now is that I have several gridview controls, each with its own checkbox control.

 

In the next script, I am trying to add spouseDetails checkbox but it is not working.

 

Each time, I check the grid1Details control and hit the submit button, it doesn't validate the spouseDetails checkbox.

 

Any ideas what I am doing wrong?

 

Thanks a lot in advance

 

 

 

 

 

 

 

[requinix]

1. Was that two different questions? One to make the code work for multiple grids and the other to add the spouseDetails checkbox?

2. Is the second script the original code that was working before?

[sonnieboy]

Just one question.

 

The second code is the working version, although I wanted to make some changes to it to remove all the spouseDetails info but this forum is a bit difficult to navigate.

 

First, it does not allow you to post your code where you want it.

 

It pushes all codes up. Maybe I am the problem, I have not figured out to post code here and display it at top or bottom.

 

Second issue is there is no way to go back and make changes to your own thread.

 

I was attempting to show the code that works for just one checkbox, grid1Details and how to make it work for more than one checkboxes.

[requinix]

The forum does sometimes do some unexpected things when it comes to post text and code blocks... And editing is only available for a few minutes after posting as an anti-spam thing - replying with more information is fine too.

 

When you say there are multiple grids, you mean before there was one and now you need to support more than one on page? And I assume validate() is supposed to validate all the grids at once?

 

validate() can still work but now it has to work on each grid independently. I'm not sure how you'd get each ClientID for all the grids into the Javascript, but I'd go for classes regardless. As in give each one a CssClass of, like, "validation-grid" or something. Then wrap all the validate() code into a loop over each .validation-grid, and change how you get the checkbox and textboxes so they come from current grid.

function validate() {
	$(".validation-grid").each(function() {
		var $grid = $(this);

		var checkbox = $grid.find("???")[0];
		var txtspousename = $grid.find("[id*='txtspousename']")[0];
		var txtspouseaddress = $grid.find("[id*='txtspouseaddress']")[0];
		var txtspouseincome = $grid.find("[id*='txtspouseincome']")[0];

		// ...

	});
}

I don't know what selector you need for the checkbox, not just because there's more than one now but because what you had before didn't seem to be working, but I would guess it should be something [id*=...] like the others.