ddslick चुनिंदा विकल्प चुने गए विकल्प का पोस्ट मूल्य पोस्ट किया गया - jquery प्लगइन

Question

मैं आइकन के साथ ड्रॉप डाउन मेनू बनाने के लिए ddslick का उपयोग कर रहा हूं, केवल एक ही समस्या यह है कि जब मैं फॉर्म पोस्ट करता हूं तो चयनित विकल्प का मान हमेशा खाली होता है, यह काम करता है ठीक है अगर मैं ddslick बंद कर देता हूँ।

<script language="javascript" type="text/javascript"> 
$('.cflagdd').ddslick({ 
onSelected: function(selectedData){ 
    //callback function: do something with selectedData; 
    // $('#editcflag').submit(); - this does not work, posts form on page load 
} 
}); 
</script> 

<select class="cflagdd" name="cflag"> 
<option value="0" selected="selected">No action flag set</option> 
<option value="1" data-imagesrc="'.base_url().'images/Actions-flag-green-icon.png">Resolved</option> 
<option value="2" data-imagesrc="'.base_url().'images/Actions-flag-yellow-icon.png">Investigate</option> 
<option value="3" data-imagesrc="'.base_url().'images/Actions-flag-red-icon.png">Urgent</option> 
<option value="4" data-imagesrc="'.base_url().'images/Actions-flag-blue-icon.png">False positive</option> 
</select> 

संस्करण: Jquery-1.7.2.js jQuery यूआई - v1.8.20

किसी भी मदद के लिए धन्यवाद, बहुत apreceated

Answer 1

शायद यह एक से एक बेहतर समाधान लेकिन क्या मैंने किया था जब मैं इसमें भाग गया तो मैंने अपना चयनित मूल्य लिया और इसे एक छिपे हुए इनपुट तत्व में रखा।

<script language="javascript" type="text/javascript"> 
    $('.cflagdd').ddslick({ 
     onSelected: function(selectedData){ 
      if(data.selectedIndex > 0) { 
       $('#hidCflag').val(data.selectedData.value); 

       $('#editcflag').submit(); 
      } 
     }  
    }); 
</script> 

<input type="hidden" name="hidCflag" id="hidCflag" value="" /> 

<select class="cflagdd" name="cflag"> 
    <option value="0" selected="selected">No action flag set</option> 
    <option value="1" data-imagesrc="'.base_url().'images/Actions-flag-green-icon.png">Resolved</option> 
    <option value="2" data-imagesrc="'.base_url().'images/Actions-flag-yellow-icon.png">Investigate</option> 
    <option value="3" data-imagesrc="'.base_url().'images/Actions-flag-red-icon.png">Urgent</option> 
    <option value="4" data-imagesrc="'.base_url().'images/Actions-flag-blue-icon.png">False positive</option> 
</select> 

Answer 2

ddslick प्लगइन सभी का चयन टैग बदलता है, और उनके लिए एक नया छिपा <input> -field पैदा करता है। अपने कोड में देखो और आप शायद एक अपरिभाषित इनपुट मिल जाएगा:

<input name="undefined" id="undefined" class="dd-selected-value" type="hidden" value="1"> 

कुछ है कि सभी plugin-page पर स्पष्ट करने के लिए नहीं है कि प्लगइन एक आसपास के div और एक नाम और करने के लिए चयन-टैग के लिए आईडी की जरूरत है ठीक से काम करो। तो का उपयोग करें:

<input name="cflag" id="cflag" class="dd-selected-value" type="hidden" value="1"> 

अपने jQuery में कंटेनर का संदर्भ लें:

$('.cflagdd_container').ddslick(); 

Answer 3

आप है selectedData डाल करने के लिए

<div id="cflagdd_container"> 
    <select class="cflagdd" name="cflag" id="cflag"> 
      <option value="0">No action</option> 
      <option value="1" selected data-imagesrc="...">Resolved</option> 
      ... 
    </select> 
</div> 

अब आप एक वैध इनपुट है ddslick जैसे क्षेत्र में इनपुट.hidden। फिर, ddslick एचटीएमएल में इनपुट तत्व प्रस्तुत करता है। जब आप एक साधारण फॉर्म-सबमिट करते हैं तो कोई भी HTML-तत्व डेटा भेजता नहीं है। ;)

Answer 4

Snipe656 वैचारिक विचार काम करता है लेकिन लिपि में एक गलती है। सही स्क्रिप्ट हिस्सा होना चाहिए:

<script language="javascript" type="text/javascript"> 
    $('.cflagdd').ddslick({ 
     onSelected: function(data){ 
      if(data.selectedIndex > 0) { 
       $('#hidCflag').val(data.selectedData.value); 

       $('#editcflag').submit(); 
      } 
     }  
    }); 
</script> 

(...)

Answer 5

@ जॉन जे

मैं आप की तरह एक ही समस्या थी। इन सभी युक्तियों/संकेतों ने यहां मदद नहीं की।

ddslick के साथ समस्या इसकी छोटी गाड़ी। चयनित आइटम के साथ कोई नाम नहीं भेजा गया है लेकिन यह

होना चाहिए।

http://ddslickremablized.remabledesigns.com/

आपका बग इस संस्करण में तय हो गई है:

इस उत्तराधिकारी का प्रयास करें। चयनित आइटम सर्वर पर सही ढंग से भेजा जाएगा।

Answer 6

आप इसे आजमा सकते हैं, यह मेरे लिए काम करता है।

$('.cflagdd').ddslick({ 
onSelected: function(selectedData){ 
    $('.dd-selected-value').prop ('name', 'cflag'); 
} 
}); 

Answer 7

डीडीएसलिक में एक बग है जो नाम विशेषता के बिना छुपा इनपुट छोड़ देता है।

मैं इसे बनाने वाले छिपे तत्व में चयन का नाम विशेषता जोड़ने के लिए डीडीएसलिक पर कुछ पंक्तियां जोड़ने में सक्षम था।

सबसे पहले, डाउनलोड ddslick की असम्पीडित संस्करण: http://dl.dropboxusercontent.com/u/40036711/Scripts/jquery.ddslick.js

फिर लाइन 106 पर निम्नलिखित जोड़ सकते हैं या सही के साथ "वर ddSelect = ..." शुरू करने लाइनों के बाद:

// set hidden input name 
ddSelect.find('input.dd-selected-value').attr('name', $(this).attr('name')); 

Answer 8

यहाँ इस के लिए ठीक:

https://github.com/ahmeij/ddslick/commit/6a085996428dd6f1a06a6fd2195c8f4f13d8ab28

unminified स्रोत कोड में इस पंक्ति को ढूंढें (लाइन 103 के आसपास)

obj.addClass('dd-container').append(ddSelectHtml).append(ddOptionsHtml); 

और इसके नीचे जोड़ें:

// Inherit name attribute from original element 
obj.find("input.dd-selected-value").attr("name", $(original).attr("name")) 

यह मेरे लिए समस्या का समाधान हो!

Answer 9

Solution 
<select id="status" name="status" class="ddslick" > 
     <option value="1">Admin Only</option> 
     <option value="2">Editing</option> 
     <option value="3">Review</option> 
     <option value="4">Live</option> 
</select> 

<script> 
$("select.ddslick").each(function(){ 
     var name = $(this).attr('name'); 
     var id = $(this).attr('id'); 
     $("#"+id).ddslick({ 
      showSelectedHTML: false, 
      onSelected: function(selectedData){ 
       $("#"+id+ " .dd-selected-value").prop ('name', name); 
      } 
     }); 
    }); 
</script> 

Answer 10

गतिशील छिपे हुए इनपुट कि चयनित विकल्प के मूल्य को संग्रहीत करता है में कोई नाम शामिल करके इसे ठीक करने प्रबंधित।

HTML में:

<select id='locationList'> 
    <option value="a">a</option> 
    ... 
</select> 

जावास्क्रिप्ट में:

1. "ddslick" यह:

   $('#locationList').ddslick(); 
   

2. गतिशील रूप से करने के लिए नाम विशेषता जोड़ने छिपा

   $('#locationList').find('input[type=hidden]:first').attr("name", "location"); 
   

Answer 11

खोजने के jquery.ddslick.min.js और इस

<input class="dd-selected-value" type="hidden" /> 

इस सर्वर के लिए सही डेटा भेज देंगे

<input class="dd-selected-value" name="cflag" type="hidden" />