I have textbox and dropdownlist in a nested gridview . When a Gridview loads I want my save button be disabled. It only gets enabled if any textbox is not empty or any dropdownlist value is greater than 0 . Below is my code
Rather than providing requirements and basic markup, post sample code that reproduces the issue and include the DB schema with data. Provides the steps to reproduce the issue, the expected results, and actual results,.
By "Please choose your own textbox and dropdownlist " , I mean your html structure is different from mine. So , for example, my selector $("#GridView1 table input[type=text]") could choose all the textbox in the second gridview while it may be not the
case in your html.
So you should modify my selector according to your own html structure.
You could try code below
<script>
function validate() {
var flag = false;
//check all the textbox ans dropdownlist
$("[id*=GridView1] [id*=GridView2] input[type=text]").each(
function () {
if ($(this).val() !="") {
flag = true;
}
}
)
$("[id*=GridView1] [id*=GridView2] select").each(
function () {
if (parseInt($(this).val()) > 0) {
flag = true;
}
}
)
return flag;
}
$(
function () {
if (!validate()) {
$("#save").prop("disabled", true);
} else {
$("#save").prop("disabled", false);
}
// bind blur event to check
$("[id*=GridView1] [id*=GridView2] input[type=text]").blur(
function () {
if (!validate()) {
$("#save").prop("disabled", true);
} else {
$("#save").prop("disabled", false);
}
}
)
//bind change event to dropdown to check
$("[id*=GridView1] [id*=GridView2] select").change(
function () {
if (!validate()) {
$("#save").prop("disabled", true);
} else {
$("#save").prop("disabled", false);
}
}
)
}
)
</script>
Please replase all the GridView1 with the id of your first gridview and replace all the GridView2 with the id of your second gridview. You should also change all the save with the id of your save button.
If it still doesn't work , you could write console.log($("[id*=GridView1] [id*=GridView2] input[type=text]")) in you script to see whether the selector choose the textbox in your second gridview.
Please click F12 and click the console option.If its length is 0 , that is to say the textbox is not chosen.
Best regards,
Ackerly Xu
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue.
None
0 Points
135 Posts
TextBox and Dropdown in a GridView
Sep 25, 2018 07:27 PM|Sam Solomon|LINK
Dear all,
I have textbox and dropdownlist in a nested gridview . When a Gridview loads I want my save button be disabled. It only gets enabled if any textbox is not empty or any dropdownlist value is greater than 0 . Below is my code
<asp:GridView ID="GridView1" AutoGenerateColumns="False" runat="server" ShowHeader="False" Style="width: 100%; border-width: 0px;">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:GridView AutoGenerateColumns="false" ID="GridView2" runat="server" ShowHeader="true" GridLines="None">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:TextBox ID="txtAmount" runat="server" ItemStyle-HorizontalAlign="center"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:DropDownList ID="dropAmount" runat="server" ItemStyle-HorizontalAlign="center"></asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Button ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click" />
All-Star
37211 Points
15032 Posts
Re: TextBox and Dropdown in a GridView
Sep 25, 2018 09:26 PM|mgebhard|LINK
Rather than providing requirements and basic markup, post sample code that reproduces the issue and include the DB schema with data. Provides the steps to reproduce the issue, the expected results, and actual results,.
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 25, 2018 10:09 PM|Sam Solomon|LINK
Thank you for your reply . But I just need a JQuery validation. Just want to make sure that at least 1 textbox or dropdown value is selected
All-Star
37211 Points
15032 Posts
Re: TextBox and Dropdown in a GridView
Sep 25, 2018 10:19 PM|mgebhard|LINK
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 25, 2018 10:30 PM|Sam Solomon|LINK
I need JQuery validation, not ASP.net validation controls
Contributor
2320 Points
911 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 07:18 AM|Ackerly Xu|LINK
Hi Sam Solomon,
If you want to validate using jquery,you could try the code below.
<asp:Button runat="server" Text="save" ID="save" /> <script> function validate() { var flag = false; //check all the textbox ans dropdownlist $("#GridView1 table input[type=text]").each( function () { if ($(this).val() !="") { flag = true; } } ) $("#GridView1 table select").each( function () { if (parseInt($(this).val()) > 0) { flag = true; } } ) return flag; } $( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } // bind blur event to check $("#GridView1 table input[type=text]").blur( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } } ) //bind change event to dropdown to check $("#GridView1 table select").change( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } } ) } ) </script>The result.
Best regards,
Ackerly Xu
Please remember to "Mark as Answer" the responses that resolved your issue.
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 09:53 AM|Sam Solomon|LINK
Thanks for your reply. I tried your code but it is not working. The blur and change event are not firing
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 10:04 AM|Sam Solomon|LINK
I think we need to call textbox and dropdown by their ID's
Contributor
2320 Points
911 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 10:09 AM|Ackerly Xu|LINK
Hi Sam Solomon,
You should ensure the jquery selector select element correctly in you case.
$("#GridView1 table input[type=text]") $("#GridView1 table select")#GridView1 will choose element with id GridView1 . table will choose element with tag name table. input[type=text] will choose input of type text.
"#GridView1 table" will choose table in the element with id GridView1 .
Please choose your own textbox and dropdownlist.
Best regards,
Ackerly Xu
Please remember to "Mark as Answer" the responses that resolved your issue.
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 10:19 AM|Sam Solomon|LINK
Not sure what u mean by "Please choose your own textbox and dropdownlist.". My textbox is called "txtAmount" and dropdownlist is called "dropAmount"
None
0 Points
135 Posts
Re: TextBox and Dropdown in a GridView
Sep 26, 2018 10:21 AM|Sam Solomon|LINK
Both my textbox and dropdownlist are in a second GridView called GridView2
Contributor
2320 Points
911 Posts
Re: TextBox and Dropdown in a GridView
Sep 27, 2018 01:18 AM|Ackerly Xu|LINK
Hi Sam Solomon,
By "Please choose your own textbox and dropdownlist " , I mean your html structure is different from mine. So , for example, my selector $("#GridView1 table input[type=text]") could choose all the textbox in the second gridview while it may be not the case in your html.
So you should modify my selector according to your own html structure.
You could try code below
<script> function validate() { var flag = false; //check all the textbox ans dropdownlist $("[id*=GridView1] [id*=GridView2] input[type=text]").each( function () { if ($(this).val() !="") { flag = true; } } ) $("[id*=GridView1] [id*=GridView2] select").each( function () { if (parseInt($(this).val()) > 0) { flag = true; } } ) return flag; } $( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } // bind blur event to check $("[id*=GridView1] [id*=GridView2] input[type=text]").blur( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } } ) //bind change event to dropdown to check $("[id*=GridView1] [id*=GridView2] select").change( function () { if (!validate()) { $("#save").prop("disabled", true); } else { $("#save").prop("disabled", false); } } ) } ) </script>Please replase all the GridView1 with the id of your first gridview and replace all the GridView2 with the id of your second gridview. You should also change all the save with the id of your save button.
If it still doesn't work , you could write console.log($("[id*=GridView1] [id*=GridView2] input[type=text]")) in you script to see whether the selector choose the textbox in your second gridview.
Please click F12 and click the console option.If its length is 0 , that is to say the textbox is not chosen.
Best regards,
Ackerly Xu
Please remember to "Mark as Answer" the responses that resolved your issue.