Jump to content

How I can display dropdown menu list based on my JSON response object?


prohor

Recommended Posts

I am trying to display a dropdown list based on JSON response object, How I can set it for the following code?

in html

<select class="form-control" name="productCategories[]" id="productCategories<?php echo $x; ?>" onchange="getProductData(<?php echo $x; ?>)" >
                                  
</select>

in javascript

$.ajax({
                url: 'php_action/fetchDropdownProductData.php',
                type: 'post',
                data: {brandId : brandId},
                dataType: 'json',
                success:function(response) {
                    
            var html = '<option value="">Select Sub Category</option>';
            html += response;
            $("#productCategories"+row).html(html);
                    
                    
                } // /success
            });

Link to comment
Share on other sites

The response isn't HTML. You can't just shove it into that html variable.

jQuery, right? Forget building HTML strings manually. That sucks. If you give the $ function some element, such as that <option> you wrote up there, then jQuery will create it as a new element for you. And you can .appendTo the <select>.
Then similarly, you can create blank options without anything, use functions like .val() and .text() to modify them according to how you want each (tip: that means a loop) to look given the response data, and append them to the <select> as well.

Note that since you're appending new elements, you'll probably want to .empty() the dropdown before you start adding things to it.

Give that a shot. If you have problems, post the code you wrote and a description of how it goes wrong.

Link to comment
Share on other sites

On 6/26/2019 at 12:27 AM, Barand said:

Thanks a lot.. what I added is


success: function (response) { var html = '<option value="">Select Sub Category</option>'; response.forEach(category => { html += "<option value='" + category.categories_id + "'>"+ category.categories_name +"</option>" $("#productCategories"+row).html(html); }) }

 

 

On 7/20/2020 at 5:20 AM, requinix said:

So the result you're trying to get for those 5 rows of data is one row with cust_id=126 inc_due=0? Does the inc_amount matter?

Do you have a larger example?

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.