2011-03-20 13 views
9

का उपयोग करके अद्यतन का चयन करें मैं फोनगैप/जेक्यूएम एप्लिकेशन में जावास्क्रिप्ट के साथ एक चुनिंदा मान बदलने की कोशिश कर रहा हूं। मैंने अपना मूल्य बदलने के बाद कॉल करने के लिए सिफारिश की .selectmenu ('refresh'); यह त्रुटि प्राप्त करता है:JQuery मोबाइल: जावास्क्रिप्ट

अनचाहे प्रारंभिक से पहले selectmenu पर विधियों को कॉल नहीं कर सकता; कॉल करने का प्रयास किया गया 'रीफ्रेश'

यदि मैं उस कॉल को हटा देता हूं तो चयन पर .val() बदल जाएगा, लेकिन स्क्रीन पर ग्राफ़िक नहीं बदलेगा। .selectmenu ("ताज़ा करें") का उद्देश्य ग्राफ़िक को चयन के .val() के साथ सिंक्रनाइज़ करना है। http://jquerymobile.com/demos/1.0a3/#docs/forms/plugin-eventsmethods.html http://jquerymobile.com/test/docs/forms/forms-selects.html

मैं नए phonegap और JQM हूँ:

यहाँ संसाधनों मैं का उपयोग करने के लिए प्रयास कर रहा हूँ से दो हैं।

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta name="viewport" content="width=default-width; user-scalable=no" /> 

<meta http-equiv="Content-type" content="text/html; charset=utf-8"> 

<title>Demo Error</title> 

<script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
<script type="text/javascript" charset="utf-8"> 

function onBodyLoad() 
{ 
     document.addEventListener("deviceready",onDeviceReady,false); 
     for (i=1;i<10;i++) { 
      setTimeout('changeProduct()',i*3000); 
     } 
} 
    function changeProduct() 
    { 
     if ($("#product").val() == 'S') 
     { 
      $("#product").val('M'); 
     } 
     else 
     { 
      $("#product").val('S'); 
     } 
     console.log("calling selectmenu refesh change to " + $("#product").val()); 
     $("#product").selectmenu('refresh', true); 
    } 

/* When this function is called, PhoneGap has been initialized and is ready to roll */ 
function onDeviceReady() 
{ 
    // do your thing! 
} 

</script> 
<link rel="stylesheet" href="jquery.mobile-1.0a3.css" /> 
<link rel="stylesheet" href="quote.css" /> 
<script src="jquery-1.5.min.js"></script> 
<script src="jquery.mobile-1.0a3.js"></script> 

</head> 
<body onload="onBodyLoad()"> 
<div id="page1" data-role="page"> 
<div data-role="content"> 
    <div id="product-all" data-role="fieldcontain"> 
     <label for="product">Product:</label> 
    <select data-role="slider" name="product" id="product" value="S"> 
    <option id="one" value="S">Single</option> 
    <option id="two" value="M" selected="selected">Multi</option> 
    </select> 
    </div> 
</div> 
</div> 
</body> 
</html> 
+0

मैं बस की खोज नहीं है कि मेरे कोड होगा अगर मैं 'डेटा-रोल = स्लाइडर' से 'डेटा-रोल = चयन' में बदलता हूं तो काम करें। तो अब मेरा सवाल है, मैं स्लाइडर को कैसे बदल/रीफ्रेश कर सकता हूं? –

+0

संबंधित: http://stackoverflow.com/questions/5249250/jqm-jquerymobile- गतिशील-added-elements-not-displaying-correctly-and-css-is –

उत्तर

23

मैं यह पता लगा:

यहाँ नमूना कोड है कि चुनिंदा हर तीन सेकंड flips करने का प्रयास करता है

आप एक डेटा-भूमिका का एक मूल्य बदलना चाहते हैं जब = स्लाइडर का उपयोग कर जावास्क्रिप्ट , मूल्य बदलने के बाद, कॉल करें: $ ('# mysliderid')। स्लाइडर ('रीफ्रेश करें');

जब आप डेटा-रोल का मूल्य बदलना चाहते हैं = जावास्क्रिप्ट का उपयोग करके चयन करें, मूल्य बदलने के बाद, कॉल करें: $ ("# myselectid")। Selectmenu ('refresh', true);

यह भ्रमित हो सकता है क्योंकि आंतरिक रूप से वे दोनों का चयन करते हैं ताकि किसी को यह सोचने में गुमराह किया जा सके कि selectmenu दोनों के लिए काम करेगा।

+0

योगदान देने के लिए धन्यवाद, योगदान देने के लिए धन्यवाद। +1 – naugtur

+1

बहुत बहुत धन्यवाद, यह हास्यास्पद यह इतना मुश्किल था। – Andrew

+0

धन्यवाद, मुझे एक ही समस्या थी। हालांकि मैं इसे दस्तावेज़ों में देखता हूं: http://jquerymobile.com/demos/1.1.1/docs/forms/slider/methods.html – carillonator

0

मेरे लिए, JQM 1.4 पर, एक ही रास्ता से छुटकारा पाने के: "पहले selectmenu प्रारंभ करने पर तरीकों कॉल नहीं कर सकता; विधि 'ताज़ा' कॉल करने का प्रयास" मेरी Toggler के चारों ओर एक आवरण माता-पिता का निर्माण करना था डेटा भूमिका = "fieldcontain" तो साथ, फोन उस तत्व का .trigger ("बनाने के") बस अपना Toggler के .slider ("ताज़ा")

बुला दूसरे शब्दों में से पहले, मैं इस से बदल :

<select id='policy_toggler' data-role='slider'> 
    <option value="false">No</option> 
    <option value="true">Yes</option> 
</select> 

<script> 
$("#policy_toggler").selectmenu("refresh"); //rises prior-to-initialization error, nothing happens visually. 
</script> 
इस के लिए

:

<div class="prefparam" data-role="fieldcontain"> 
    <select id='policy_toggler' data-role='slider'> 
    <option value="false">No</option> 
    <option value="true">Sí</option> 
    </select> 
</div> 

<script> 
$(".prefparam").trigger("create"); 
$("#policy_toggler").slider("refresh"); //visual sync between real input element and visual ui element 
</script> 

ही, ध्यान दें जब JQM1.4 के साथ काम करने के लिए एक Toggler के एपीआई .slider (के साथ पहुँचा जाता है), .selectmenu()

संबंधित मुद्दे