2014-09-26 18 views
6

Bootstrap uygulaması için x düzenlenebilir bir dosya kullanıyorum. şimdi bir düğme click.value değişiyor benim span üzerinde değer değiştirmeniz gereken bir durum var ama ben x düzenlenebilir açıklık üzerine tıklarsanız, önceki değer metin kutusuna doldurulur bu benim örnek kodumx Dinamik olarak çalışmayan düzenlenebilir değer değişimi

burada

<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> 

şehir yayılma ilk 'intial değeri' ile doldurulur ve ben bir metin kutusu 'intial değeri' value görüneceğini yayılma tıklayın olduğum sürece, o zaman ben tıklarsanız değiştir düğmesi span değeri 'değiştirilen değer' olarak değiştirilecektir. önceki değerini howing 'İntial değer' dan bahsederler i herhangi bir yardım bir x-düzenlenebilir nesneye yeni bir değer ayarlamak için

bu jfiddle bağlantı jfiddle

+0

size yardımcı olabilir misiniz? – divakar

+0

@divakar jfiddle bağlantısını ekledim – abhi

cevap

21

olduğu takdir edilecektir bu sorunu çözebilirsiniz, onun aramak zorunda yöntem setValue.

Documentation Here

Demo: JSFiddle

Örnek:

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

İşte çözümdür. Yapmanız gereken tek şey, değiştirilmiş butona da değer koymaktır. Bu satırı $('#city').editable('setValue', "changed value", true); '# change' düğmesine tıklamanız yeterlidir. Daha fazla detay için bu jsfiddle koduma bakın: http://jsfiddle.net/smvora_4u/epf7frz4/

İlgili konular