Solved

dropdown list

Posted on 2014-03-18
4
204 Views
Last Modified: 2014-03-19
Hi,

I don't know why my Jquery doesn't work :(

I want to show the TicketNumberTxt if the SelectTicketNumber has a value on the onload event.

 if($("#SelectTicketNumber").val() != null || $("#SelectTicketNumber").val() != undefined || $("#SelectTicketNumber").val() != ""){ 
	$("#ShowHideSubTicketText").show();
  }

Open in new window



 
<div class="ShowHideTicketNumber">
 <select name="SelectTicketNumber" id="SelectTicketNumber" style="width:195px;">
<option value=""> </option>
<option value="2">test</option>
<option value="3">next</option>
</select>
</div>

   <div id="ShowHideSubTicketText" class="ShowHideTicketNumber ">
                    <input type="text" class="DisableTicketNumberTxt" id="TicketNumberTxt" name="TicketNumberTxt" />  
                    </div>  

Open in new window

0
Comment
Question by:lulu50
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 15

Expert Comment

by:Insoftservice
ID: 39937542
I have not used jquery. it could be simply replace by jquery
.submit()

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script type="text/javascript">
  function test(val)
  {
	   alert(val)
  if(val !=0){ 
	document.getElementById("ShowHideSubTicketText").style.display='block';
  }
  else
	  {
		  	document.getElementById("ShowHideSubTicketText").style.display='block';
	  }
  }

  </script>
 </head>
 <body>
  <div class="ShowHideTicketNumber">
 <select name="SelectTicketNumber" id="SelectTicketNumber" style="width:195px;" onChange="test(this.value)";>
<option value="0"> </option>
<option value="2">test</option>
<option value="3">next</option>
</select>
</div>

   <div id="ShowHideSubTicketText" class="ShowHideTicketNumber " style='display:none'>
                    <input type="text" class="DisableTicketNumberTxt" id="TicketNumberTxt" name="TicketNumberTxt" />  
                    </div>  
                                  
 </body>
</html>

Open in new window

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39937547
With jQuery : http://jsfiddle.net/2RdF2/

function updateSubTicketVisibility() {
    var ticketHaveValue = !!$("#SelectTicketNumber").val();
    var cssDisplay = ticketHaveValue ? "block" : "none";
    $("#ShowHideSubTicketText").css("display", cssDisplay);
}

jQuery(function($) {
    $("#SelectTicketNumber").change(updateSubTicketVisibility)
        .trigger("change"); // RUN IT ONCE AT THE << ONLOAD >> EVENT
    
});

Open in new window


CSS :
#ShowHideSubTicketText {
    display:none;
}

Open in new window

0
 
LVL 15

Expert Comment

by:Insoftservice
ID: 39937584
its not submit but its $( "#SelectTicketNumber" ).val(); to get value of select option.
0
 

Author Closing Comment

by:lulu50
ID: 39939499
Thank you
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Requirements JQuery 1.6+ HTML CSS Introduction This article was inspired by an EE question (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28372511.html) on how to make a page show some balloons animate up a page…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question