jquery Mobile Interface Data Refresh

jquery Mobile Interface Data Refresh

JQM inside when we update the data in certain page tags (such as ListView, RadioButtons, checkboxes, select Menus), you must do a refresh operation.

Why do I have to do the refresh operation? Because JQM in the rendering of the page, in order to make the style with the client program, hide the original label and then use some new tags and custom style to represent the original label, in fact, the new style of the label is not the original label, So updating the data must do the refresh operation.

Refresh of all kinds of labels

1.Textarea fields

$ (' body '). Prepend ('<id= "Mytextarea"></textarea > '); $ (' #myTextArea '). TextInput ();

2.Text input Fields

$ (' body '). Prepend ('<type= ' text '  id= ' MyTextField ')  />'); $ (' #myTextField '). TextInput ();

3.Buttons

$ (' body '). Append ('<href= ""  data-theme= "E"  ID = "Mynewbutton" >testing</a>'); $ (' #myNewButton '). button ();

4.Combobox or select dropdowns

<label for= "Scountry">Country:</label><Selectname= "Scountry"ID= "Scountry"><optionvalue="">Where you Live:</option><optionvalue= "AD">Andorra</option><optionvalue= "AE">Arab Emirates</option></Select>var myselect = $ ("#sCountry"); Myselect[0].selectedindex = 3;myselect.selectmenu (' refresh ');

5.Listviews

<ulID= "MyList"Data-role= "ListView"Data-inset= "true"><Li>Acura</Li><Li>Audi</Li><Li>BMW</Li></ul>$ (' #mylist '). ListView (' Refresh ');

6.Slider Control

<DivData-role= "Fieldcontain"><label for= "Slider-2">Input Slider:</label><inputtype= "Range"ID= "Slider-2"value= "+"min= "0"Max= "+" /></Div>$ (' #slider-2 '). val. Slider (' Refresh ');

7.Toggle switch

<DivData-role= "Fieldcontain"><label for= "Toggle">Flip Switch:</label><Selectname= "Toggle"ID= "Toggle"Data-role= "Slider"><optionvalue= "Off">Off</option><optionvalue= "On">On</option></Select></Div>var myswitch = $ ("#toggle"); myswitch[0].selectedindex = 1;myswitch. Slider ("Refresh");

8.Radio buttons

<DivData-role= "Fieldcontain">    <fieldsetData-role= "Controlgroup"Data-type= "Horizontal">      <legend>Layout View:</legend>          <inputtype= "Radio"name= "Radio-view"value= "List" />          <label for= "Radio-view-a">List</label>          <inputtype= "Radio"name= "Radio-view"value= "Grid" />          <label for= "Radio-view-b">Grid</label>          <inputtype= "Radio"name= "Radio-view"value= "Gallery" />          <label for= "Radio-view-c">Gallery</label>    </fieldset></Div>$ ("Input[value=grid]"). attr (' checked ', true). Checkboxradio (' refresh ');

9.Checkboxes

<DivData-role= "Fieldcontain"><fieldsetData-role= "Controlgroup"><legend>Agree to the terms:</legend><inputtype= "checkbox"name= "Checkbox-1"ID= "Checkbox-1"class= "Custom" /><label for= "Checkbox-1">I Agree</label></fieldset></Div>$ (' #checkbox-1 '). attr (' checked ', true). Checkboxradio (' refresh ');