JSFiddle - React, Tailwind, and code Playground

by 533135

HTML

<select id = ServiceDD>

</select>


<div> Gokul, </div>
<div>
    <code>1.jsonResponse array u will get from success function of ajax call,
    
    2.copy the code  as mentioned in javascirpt and pastei n in seperate javascirpt file
        3.i also mentioned the code to be kept in success method</code>
</div>

JavaScript

$(document).ready(function(){
var jsonResponse = [
   {
      "ProDesc":"A\/H SFSIDING,SOFFIT,FASCIA,EAVES",
      "StoreNumber":""
   },
     {
      "ProDesc":"A\/H SFSIDING,SOFFIT,FASCIA,EAVES",
      "StoreNumber":""
   },
   {
      "ProDesc":" DECORATING SERVICES",
      "StoreNumber":""
   },
   {
      "ProDesc":" DECORATING",
      "StoreNumber":""
   },
   {
      "ProDesc":" 3 CM SILESTONE COUNTERTOP",
      "StoreNumber":"",
           "Prog":"1000477465",
   },
   {
      "ProDesc":"A\/H SFSIDING,SOFFIT,FASCIA,EAVES",
      "StoreNumber":"",
           "Prog":"1000477465"
   },
   {
      "ProDesc":"A\/H SFSIDING,SOFFIT,FASCIA,EAVES",
      "StoreNumber":"",
           "Prog":"1000477465"
   },
   {
      "ProDesc":" NATIONAL CERAMIC TILE FLOORING",
      "StoreNumber":""
   },
   {
      "ProDesc":"I Decor",
      "StoreNumber":"",
           "Prog":"1000477465"
   },
   {
      "ProDesc":" DECORATING SERVICES",
      "Prog":"1000477465",
      "StoreNumber":"0000007080"
   },
   {
     "ProDesc":"COLOUR CONSULTATION",
      "StoreNumber":"0000007080"
   },
   {
      "ProDesc":" DECORATING SERVICES",
      "StoreNumber":"0000007080",
        "Prog":"1000477465"
   }
];

  //--copy starts from here paste in seperete file-------------------//
    
    (function($){

        //generate Dropdown-this can be used as common method to genereate dropdown from json object
        $.dropdownGen = function(arr,id, text,value){
      $("#"+id).html($("<option>",{text:"select",value:" "}));
            for(var i=0;i<arr.length;i++){
                if(arr[i].hasOwnProperty(value))
console.log(isNaN(arr[i][value]))
         if(arr[i].hasOwnProperty(value) && !isNaN(arr[i][value]))
$("<option>",{text:arr[i][text],value:arr[i][value]}).appendTo("#"+id);
            }
                                            
            };
//this mehtod is used to sortobjects by specigfic key-here-progdesc
        Array.prototype.sortObject=function(key){
var res = ...