Jquery+ajax implementing select Dynamic fixed Data

Then the last advanced query. The fields in the drop-down boxes are all written in the foreground. This is a big drawback for the flexibility of the system.

Solution Ideas:

Create a Type dictionary table in the database. The drop-down box needs to be added, in the database table Chinese, English names correspond.

The drop-down box requires fields in a dynamically bound database table.

<div id= "Bgdiv" style= "Display:none;" ></div>
                <a  class= "Btn-lit" href= "javascript:"  onclick= "bgdiv.style.display= ' inline '; Advancedquery.style.display= "; Additems ()" ><span> advanced query </span></a>

In the advanced query click event, add a drop-down box to the function that binds the field, in addition to displaying the query box. Here is Additems ().

Implementation code:

<script type= "Text/javascript" >//Dynamic Binding drop Box entry function Additems () {$.ajax ({URL: "
                Additem.ashx/getitem ",//Background WebService method name type:" Post ", DataType:" JSON ",
                    ContentType: "Application/json", Traditional:true, Success:function (data) {
                        for (var i in data) {var jsonobj =data[i];
                        var optionstring = ""; for (var j = 0; J < Jsonobj.length; J + +) {optionstring + = "<option value=\" "+ jsonobj[
                        J].id + "\" > "+ jsonobj[j].chinesename +" </option> ";
                    } $ ("#dpdField1"). HTML ("<option value= ' Please select ' > Please select ...</option>" +optionstring); }}, Error:function (msg) {alert ("error.
                ");         }
            }); 
        };  </script>

Background code:

public void ProcessRequest (HttpContext context)
        {
            //context. Response.ContentType = "Text/plain";
            Context. Response.Write ("Hello World");
            GetItem (context);
        }
        public void GetItem (HttpContext context)
        {
            string returnvalue = string. Empty;
            Basicinformationfacade Basicinformationfacade = new Basicinformationfacade ();   Instantiate the underlying information appearance of the
            datatable dt = new DataTable ();
            DT = Basicinformationfacade.itemsquery (); Get results based on query criteria
            returnvalue = datatablejson (dt);
            Context. Response.ContentType = "Text/plain";
            Context. Response.Write (returnvalue);
            return returnvalue;
        }

Convert #region DataTable to JSON format///<summary>//DataTable to JSON format//&LT;/SUMMARY&G     
        T <param name= "DT" ></param>///<returns></returns> public string Data
            Tablejson (DataTable dt) {StringBuilder Jsonbuilder = new StringBuilder ();
            Jsonbuilder.append ("{\" "); Jsonbuilder.append (dt.
            Tablename.tostring ());
            Jsonbuilder.append ("\": ["); for (int i = 0; i < dt. Rows.Count;
                i++) {jsonbuilder.append ("{"); for (int j = 0; j < dt. Columns.count;
                    J + +) {jsonbuilder.append ("\" "); Jsonbuilder.append (dt. COLUMNS[J].
                    ColumnName);
                    Jsonbuilder.append ("\": \ ""); Jsonbuilder.append (dt. ROWS[I][J].
                    ToString ());
                Jsonbuilder.append ("\", "); } Jsonbuilder.
                Remove (jsonbuilder.length-1, 1);
            Jsonbuilder.append ("},");
            } jsonbuilder.remove (jsonbuilder.length-1, 1);
            Jsonbuilder.append ("]");
            Jsonbuilder.append ("}");
        return jsonbuilder.tostring (); } #endregion

Use AJAX, JSON to bind the data source to the select in the foreground page. Backstage through two functions, the data of the database table, respectively, the data into JSON format returned to the foreground. After receiving the data, the foreground parses the data to get the fields that need to be bound in the drop-down box. At bind time, each item in the drop-down box is bound to a text, value, respectively. The text is used for display, for the user to select. Value, which is the query field that the user selects a field, gets the value of the field, and makes the background.