how to make a textbox visible using javascript in modalpopup in asp.net

Question

how to make a textbox visible using javascript in modalpopup in asp.net

HOUSSEM MAHJOUBI 286

Hi members

i have a textbox9 i want to make it visible if the textbox4="9999"

this is my code :

<script type="text/javascript">
    $(document).ready(function () {
       $("#<%=TextBox4.ClientID %>").autocomplete({
             
  $('TextBox9').attr('style', request.term == "9999" ? 'display:block;' : 'display:none;');    $('#Label20').attr('style', request.term == "9999" ? 'display:normal;' : 'display:none;');
 
           source: function (request, response) {
               
                
                
                   $.ajax({
                    type: "POST",
                    url: '<%=ResolveUrl("~/ArticleInvestigation.aspx/GetNames2") %>',
                    data: "{ 'prefix': '" + request.term + "'}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
 
                       response($.map(data.d, function (item) {
                            return {
 
                                label: item.split('-')[0],
                                val: item.split('-')[1]
                            }
                        }))
                    },
                    error: function (response) {
                        alert(response.responseText);
                    }
                });
              
            },
             
            select: function (e, i) {
                
                $("[id$=hfName]").val(i.item.label);
                $.ajax({
                    type: "POST",
                    url: '<%=ResolveUrl("~/ArticleInvestigation.aspx/GetCountry2") %>',
                    data: "{ 'name': '" + i.item.label + "'}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        $("[id*=TextBox3]").val(response.d.split('-')[0]);
                        $("[id*=TextBox6]").val(response.d.split('-')[1]);
                 
 
                    },
                    error: function (response) {
                        alert(response.responseText);
                    }
                });
               
           },
             
            minLength: 0
        });
    });
</script>

i want when the automplete get the click and the value equal to '9999' and the textbox4 receive that value after the

textbox9 should appear or disappear if not equal to '9999'

the is the textbox looks like and the label:

 
 <asp:TextBox ID="TextBox9" runat="server" Width="205px" style="display:none;"></asp:TextBox>
 <asp:Label ID="Label20" runat="server" Text="Client divers:" style="display:none;"></asp:Label>

please help

AgaveJoe 30,126 Reputation points

2023-02-22T14:54:56.3033333+00:00
Shouldn't you use the ClientID and ID selector like you're doing with the other server controls?

$("#<%=TextBox9.ClientID %>")

Also, please use the browser's dev tools to debug your JavaScript.
HOUSSEM MAHJOUBI 286 Reputation points

2023-02-22T15:20:44.3566667+00:00
yes thats the error :

$("#<%=TextBox9.ClientID %>").attr('style', request.term == "9999" ? 'display:block;' : 'display:none;'); $("#<%=Label20.ClientID %>").attr('style', request.term == "9999" ? 'display:normal;' : 'display:none;');

now it works fine but only when i right 9999 using keyboard if i selected using the autocomplete not work

is there any fix for that
AgaveJoe 30,126 Reputation points

2023-02-22T15:43:20.03+00:00

now it works fine but only when i right 9999 using keyboard if i selected using the autocomplete not work

I have no idea what "not work" means. You have to make an effort to figure what is not working. Is there an error in the browser's dev tools Console? Is the AJAX function called? Is the GetNames2 or the GetCountry2 being called? Are the Web Methods returning data?

Please use the standard debugging tools to troubleshoot your code; Visual Studio and the browser's dev tools.
HOUSSEM MAHJOUBI 286 Reputation points

2023-02-22T15:52:59.8733333+00:00

i get the result i want, when i write 9999 the textbox9 appear and also the label it work fine

but that only when i write using the keyboard thats fine,

but when i write for example 999 the autocomplete appear and when i select the 9999 the textbox not appear

only when i delete the 4th 9 like this 999 after i add 9 like this will appear

i have no error in browser
AgaveJoe 30,126 Reputation points

2023-02-22T16:10:10.7933333+00:00
Is there some logical reason why you are unable to debug your own code? Perhaps the code takes a different path and you need two places in the code to show/hide the element. Or maybe you need another event handler. Set a break point and step through your code to understand how your code works!

$("#<%=TextBox9.ClientID %>").show();

Accepted answer

0 additional answers

Your answer

AgaveJoe 30,126 Reputation points

2023-02-22T14:54:56.3033333+00:00

Shouldn't you use the ClientID and ID selector like you're doing with the other server controls?

$("#<%=TextBox9.ClientID %>")

Also, please use the browser's dev tools to debug your JavaScript.
HOUSSEM MAHJOUBI 286 Reputation points

2023-02-22T15:20:44.3566667+00:00

yes thats the error :

$("#<%=TextBox9.ClientID %>").attr('style', request.term == "9999" ? 'display:block;' : 'display:none;'); $("#<%=Label20.ClientID %>").attr('style', request.term == "9999" ? 'display:normal;' : 'display:none;');

now it works fine but only when i right 9999 using keyboard if i selected using the autocomplete not work

is there any fix for that
AgaveJoe 30,126 Reputation points

2023-02-22T15:43:20.03+00:00

now it works fine but only when i right 9999 using keyboard if i selected using the autocomplete not work

I have no idea what "not work" means. You have to make an effort to figure what is not working. Is there an error in the browser's dev tools Console? Is the AJAX function called? Is the GetNames2 or the GetCountry2 being called? Are the Web Methods returning data?

Please use the standard debugging tools to troubleshoot your code; Visual Studio and the browser's dev tools.
HOUSSEM MAHJOUBI 286 Reputation points

2023-02-22T15:52:59.8733333+00:00

i get the result i want, when i write 9999 the textbox9 appear and also the label it work fine

but that only when i write using the keyboard thats fine,

but when i write for example 999 the autocomplete appear and when i select the 9999 the textbox not appear

only when i delete the 4th 9 like this 999 after i add 9 like this will appear

i have no error in browser
AgaveJoe 30,126 Reputation points

2023-02-22T16:10:10.7933333+00:00

Is there some logical reason why you are unable to debug your own code? Perhaps the code takes a different path and you need two places in the code to show/hide the element. Or maybe you need another event handler. Set a break point and step through your code to understand how your code works!

$("#<%=TextBox9.ClientID %>").show();

Answer 1

Lan Huang-MSFT 30,186 Microsoft External Staff

Hi @HOUSSEM MAHJOUBI,

You can put the code inside the select method.

 select: function (e, ui) {                                  
     $("#<%=TextBox9.ClientID %>").attr('style', ui.item.value == "9999" ? 'display:block;' : 'display:none;');
     $("#<%=Label20.ClientID %>").attr('style', ui.item.value == "9999" ? 'display:normal;' : 'display:none;');
            },

TEST1

Best regards,
Lan Huang

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

HOUSSEM MAHJOUBI 286

thank you Lan Huang and AgaveJoe now it is work fine

in two way while writing or selecting from the autocomplete

this code for the autocomplete :

select: function (e, ui) {                                  
     $("#<%=TextBox9.ClientID %>").attr('style', ui.item.value == "9999" ? 'display:block;' : 'display:none;');
     $("#<%=Label20.ClientID %>").attr('style', ui.item.value == "9999" ? 'display:normal;' : 'display:none;');
            },

and for just writing this code :

$("#<%=TextBox9.ClientID %>").attr('style', request.item.value == "9999" ? 'display:block;' : 'display:none;');
     $("#<%=Label20.ClientID %>").attr('style', request.item.value == "9999" ? 'display:normal;' : 'display:none;');

Share via

how to make a textbox visible using javascript in modalpopup in asp.net

0 additional answers

Your answer