Solved

jquery, dropdown

Posted on 2016-09-08
4
75 Views
Last Modified: 2016-11-15
function OnSuccess(response) {

         var productSubCode = '#' + '<%=PRODUCT_SUBCODE.ClientID %>';
         var sc = $(productSubCode).empty();
         $.each(response.d, function (i, d) {
             sc.append($('<option/>').val(d).html(d));           
         });
         //alert("Success: " + response.d);
     }

Open in new window


It seems like OnSuccess return me  <select><option>Test</option></select> only.
How can I get a point return me below:

<select><option value="Test">Test</option></select>
0
Comment
Question by:ITsolutionWizard
  • 2
  • 2
4 Comments
 
LVL 56

Expert Comment

by:Julian Hansen
ID: 41790079
There must be something else wrong.
This code using your javascript works perfectly. How are you examining the created <option>'s?
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery.js"></script>
</head>
<body>
<select id="test"></select>
<script>
function OnSuccess(response) {
  var sc = $('#test').empty();
  $.each(response.d, function (i, d) {
    sc.append($('<option/>').val(d).html(d));          
  });
}
var data = {
   d: [
      'test1',
    'test2',
    'test3'
   ]
}
OnSuccess(data);
</script>
</body>
</html>

Open in new window


Working sample here
0
 
LVL 82

Expert Comment

by:leakim971
ID: 41792053
try this one :

function OnSuccess(response) {

         var productSubCode = '#' + '<%=PRODUCT_SUBCODE.ClientID %>';
         var sc = $(productSubCode).empty();
         var jsonString = response.d;
         var jsonObject = $.parseJSON(jsonString);
         $.each(jsonObj, function (i, d) {
             sc.append($('<option/>').val(d).html(d));           
         });
         //alert("Success: " + response.d);
     }

Open in new window


optimized(?) version :
function OnSuccess(response) {

         var productSubCode = '#' + '<%=PRODUCT_SUBCODE.ClientID %>';
         var jsonString = response.d;
         var jsonObject = $.parseJSON(jsonString); // please note $.parseJSON is deprecated since jquery 3.0
         var sc = new Array();
         for(var i=0;i<jsonObject.length;i++)
         {
             var d = jsonObject[i];
             sc.push("<option value='" + d +"'> + d + "</option>");           
         };
         $(productSubCode).html(sc.join(""));
         //alert("Success: " + response.d);
     }

Open in new window

0
 
LVL 56

Accepted Solution

by:
Julian Hansen earned 500 total points
ID: 41792274
We are missing a bit of the puzzle here
You have this
$.each(response.d, function (i, d) {
  sc.append($('<option/>').val(d).html(d));           
});

Open in new window

Which produces this
<select><option>Test</option></select>

Open in new window

So 'd' in the loop is evaluating to Test. If d was an unparsed JSON string we should still see the full JSON string in the value.

Can you do some screen grabs (if you can't send us a link)
1. Right click the Select and select inspect element (Show us the HTML for this)
2. Click the console tab and show us the returned response from the server

Can you also show us the code that is generating the response.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 41889193
The accepted answer ask questions when my last answer solve the issue especially my optimised version.
We know .Net return : {d:"the json string"}
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

This article discusses how to create an extensible mechanism for linked drop downs.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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)
The viewer will learn the basics of jQuery including how to code hide show and toggles. 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…

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