2011-03-07 14 views
7

काम नहीं कर रहा है मैं एक मॉडल JQuery UI संवाद बॉक्स बना रहा हूं और परिणाम $ संवाद चर में संग्रहीत कर रहा हूं। बटन के आधार पर बदल जाते हैं, जिस पर आपरेशन चुना जाता है, तो मैं इस तरह एक समारोह कॉल का उपयोग कर बटन सेट:Jquery UI संवाद बटन पाठ

$dialog.dialog("option", "buttons", [ 
    { 
     text: "Ok", 
     click: function() { close_project(); } 
    }, 
    { 
     text: "Cancel", 
     click: function() { ($this).dialog("close"); } 
    } 
]); 

इससे उन्हें में पाठ '0' और '1' के बजाय 'ओके' के साथ दो बटन को प्रदर्शित करता है और 'रद्द करें'। साथ ही, क्लिक फ़ंक्शन काम नहीं कर रहे हैं।

मैं इस पर कई बार चला गया हूं और वाक्यविन्यास सही दिखता है। मैं क्या गलत कर रहा हूं?

+1

आपका वाक्य रचना करने के लिए प्रकट होता है के लिए काम किया सही हो क्या संवाद में संशोधन करने वाला कोई अन्य कोड है? AutoOpen के लिए –

उत्तर

6

jQuery यूआई इस विधि के लिए सहायता करता है जिसका उपयोग आप पहले से शुरू किए गए मोडल के लिए है - http://jqueryui.com/demos/dialog/#option-buttons क्या यह मामला है?

यदि नहीं, तो इस एक कोशिश और उसके बाद प्रयोग यह किस प्रकार अलग करने या अपने समाधान के लिए उपयुक्त है:

$dialog.dialog("option", "buttons", { 
     "Ok": function() { close_project(); }, 
     "Cancel": function() { $(this).dialog("close"); } 
    } 
); 
3

आप इस तरह से वाक्य रचना कोशिश कर सकते हैं यह निर्दिष्ट करने के लिए एक बूलियन ध्वज है कि टैग का पाठ प्रदर्शित होना चाहिए या नहीं। शायद आपको बटन के .html() को बदलने का प्रयास करना चाहिए उदा।

$("#Button1").html("Ok"); 
0

"पाठ" विकल्प:

$dialog.dialog({ buttons: [ 
    { 
     text: "Ok", 
     click: function() { close_project(); } 
    }, 
    { 
     text: "Cancel", 
     click: function() { $(this).dialog("close"); } 
    } 
]}); 
1

मेरे पास "0 1" बटन लेबल समस्या थी। मुझे ऑब्जेक्ट सिंटैक्स के बजाय बटन के लिए सरणी वाक्यविन्यास की आवश्यकता थी क्योंकि मैं बटन आईडी सेट करना चाहता था (मेरा कोड rdadsorsky की तरह आईडी सेट के साथ दिखता था और अभी भी काम नहीं करता था)। मैं इस सवाल को देखा:

jQuery UI Dialog Button Icons

और प्रश्न में प्रयास किया कोड को संशोधित किया। अपने विशिष्ट उदाहरण के लिए:

$dialog.dialog({ buttons: { 
     "Ok": function() { close_project(); }, 
     "Cancel": function() { $(this).dialog("close"); } 
    }, 
    open: function() { 
     $('.ui-dialog-buttonpane').find('button:contains("Cancel")').attr("id", "cancel_button"); 
     $('.ui-dialog-buttonpane').find('button:contains("Ok")').attr("id", "ok_button"); 
}}); 

संयोग से, मैं नोटिस एक (इस $) जब मुझे लगता है कि आप अपने कोड में $ (this) मतलब है। इससे एक क्लिक खराब हो सकता है। अन्य क्लिक में कोई समस्या हो सकती है (लेकिन केवल अगर यह किसी एजेक्स अनुरोध में है): यदि आप आईई 7 या 8 में हैं, तो आईई (AJAX) स्कोपिंग समस्या को रोकने के लिए थोड़ा बदलाव करें। अपने $ dialog.dialog कोड से पहले, "window.close_project = close_project;" करें और फिर "window.close_project();" कॉल करें क्लिक फ़ंक्शन में।

एफवाईआई, यदि आपको आईडी या कक्षा या कुछ और बदलने की आवश्यकता नहीं है, तो "खोलें" ड्रॉप करें और बटन के लिए ऑब्जेक्ट सिंटैक्स का उपयोग करें। या, केवल अमूर के जवाब का उपयोग करें।

1

ऐसा लगता है कि सेटर काम नहीं कर रहा है। क्या मैं बजाय किया सभी विकल्पों को एक ही बार में सेट के साथ संवाद से भरा आरंभीकरण है:

<script type="text/javascript"> 
    $("#DiscardDialog").dialog(
    { 
     autoOpen: false, 
     title: "Discard", 
     buttons: 
     { 
      "Yes": function() 
      { 
       window.location = "@Url.Action("Discard", new { ID = this.Model.ID })"; 
      }, 
      "No": function() 
      { 
       $(this).dialog("close"); 
      } 
     } 
    }); 
</script> 
+1

+1: झूठी। यह कोई अन्य उदाहरण नहीं देखा है। – ter24

1

यह भी काम करता है:

buttons: { 
     'Do some action': function() { 
      //a button called 'Do some action' is created 
     }, 
     Close: function() { 
      //a button called 'Close' is created 
      $(this).dialog('close'); 
     } 
    }, 
    open: function() { 
     //event fires when dialog opens 
    }, 
    close: function() { 
     //event fires when dialog closes 
    } 
0

यह मैं

$("#dialog-form").dialog 
(
{ 
    autoOpen: false, 
     height: 300, 
    width: 350, 
    resizable: false, 
    autoOpen: false, 
    modal: true, 
    buttons: { 
     'Guardar' : function() 
     { 
      $("#dialog-form").dialog("close"); 
      $(this).html("Guardar"); 
     }, 
     Cancel: function() 
     { 
      $(this).html("Cancelar"); 
      $("#dialog-form").dialog("close"); 
     } 
    } 
}); 
संबंधित मुद्दे