2014-09-26 14 views
6

पर संपादन योग्य मूल्य परिवर्तन मैं बूटस्ट्रैप एप्लिकेशन द्वारा x संपादन योग्य फ़ाइल का उपयोग कर रहा हूं। अब मेरे पास एक ऐसी स्थिति है जहां मुझे बटन पर क्लिक करके मेरे स्पैन पर मूल्य बदलने की ज़रूरत है। औसत बदल रहा है लेकिन अगर मैं उस एक्स संपादन योग्य अवधि पर क्लिक कर रहा हूं, तो पिछले मान टेक्स्ट बॉक्स पर पॉप्युलेट किया गया है यह मेरा नमूना कोडx गतिशील रूप से

है

<head> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 
    <meta charset="utf-8" /> 
    <title>Patient portal</title> 
      <meta name="description" content="3 styles with inline editable feature" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> 
      <link rel="stylesheet" href="assets/css/bootstrap-editable.css" /> 

</head> 

<body ><!-- #section:basics/navbar.layout --> 
     <div> 
       <span class="editable" id="city"> intial value </span> 
       <button id="change">change value</button> 

     </div> 
      <script type="text/javascript"> 
     window.jQuery || document.write("<script src='assets/js/jquery.min.js'>"+"<"+"/script>"); 
    </script> 
    <script src="assets/js/bootstrap.min.js"></script> 
      <script src="assets/js/x-editable/bootstrap-editable.min.js"></script> 
    <script src="assets/js/x-editable/ace-editable.min.js"></script> 

    <!-- inline scripts related to this page --> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
     $.fn.editable.defaults.mode = 'inline'; 
     $.fn.editableform.loading = "<div class='editableform-loading'><i class='ace-icon fa fa-spinner fa-spin fa-2x light-blue'></i></div>"; 
    $.fn.editableform.buttons = '<button type="submit" class="btn btn-info editable-submit"><i class="ace-icon fa fa-check"></i></button>'+ 
             '<button type="button" class="btn editable-cancel"><i class="ace-icon fa fa-times"></i></button>'; 
    $('#city').editable({ 
      type: 'text', 
      name: 'FirstName', 
      title: 'enter First Name', 
      validate: function(value) { 
       if($.trim(value) == '') 
        return ' First Name is required'; 
       else if($.trim(value).length>30) 
        return 'Only 50 charateres are allowed'; 
       } 

     }); 



     $('#change').click(function(){ 
      $('#city').text("changed value") 
     }); 

    }) 

    </script> 

</body> 

यहाँ

शहर काल 'आरंभिक मूल्य' पहली भरा हुआ है और जब तक मैं हूँ उस अवधि एक पाठ बॉक्स मान 'आरंभिक मूल्य' दिखाई देगा पर क्लिक करें, फिर अगर मैं पर क्लिक करें बदलें बटन अवधि मूल्य बदल दिया जाएगा 'बदले गए मूल्य'। तो अगर मैं फिर से स्पैन पर क्लिक करता हूं तो टेक्स्ट बॉक्स एस है पिछले मान howing 'आरंभिक मूल्य' .कैसे मैं इस मुद्दे को किसी भी मदद

इस jfiddle लिंक jfiddle

+0

क्या आप परेशान हो सकते हैं? – divakar

+0

@divakar मैंने jfiddle लिंक जोड़ा – abhi

उत्तर

21

है की सराहना की होगी एक एक्स-संपादन योग्य वस्तु के लिए एक नया मान सेट के लिए ठीक कर सकते हैं, तो आप अपने फोन करने के लिए है विधि setValue

Documentation Here

डेमो: JSFiddle

उदाहरण:

$('#change').click(function(){ 
     $('#city').editable('setValue',"changed value"); 
    }); 
1

यहाँ अपने समाधान है। आपको केवल बदले गए बटन पर सेट वैल्यू करने की ज़रूरत है। आपको '#change' बटन के क्लिक में केवल $('#city').editable('setValue', "changed value", true); को जोड़ने की आवश्यकता है। अधिक जानकारी के लिए यह मेरा jsfiddle कोड देखें: http://jsfiddle.net/smvora_4u/epf7frz4/

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