फॉर्म

में एंटर दबाते समय क्यूब मोडल बंद हो जाता है, मैं Kube CSS & JS framework (6.5.2) से इसके अंदर एक फॉर्म के साथ एक मॉडल का उपयोग कर रहा हूं। जब मैं एंटर दबाता हूं, तो मोड फॉर्म सबमिट किए बिना बंद हो जाता है।फॉर्म

संपादित करें: यह तब होता है जब पासवर्ड या खोज इनपुट पर ध्यान केंद्रित नहीं किया जाता है - 'टेक्स्ट' से 'पासवर्ड' के प्रकार को बदलने से समस्या ठीक होती है।

<!DOCTYPE html> 
<html> 
<head> 
    <title>Basic Template</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- Kube CSS --> 
    <link rel="stylesheet" href="dist/css/kube.css"> 
</head> 
<body> 
    <h1>Hello, world!</h1> 

    <div id='ui-modal-test' class='modal-box hide'> 
     <div class='modal' style='width:95%'> 
      <span class='close'></span> 
      <div class='modal-header'>Modal Form Test</div> 
      <div class='modal-body'> 
       <form id="ui-modal-form"> 
        <input type="text" name="field1"> 
        <input type="text" name="field2"> 
        <input type="text" name="field3"> 
        <button>Apply</button> 
       </form> 
      </div> 
     </div> 
    </div> 
    <button data-component="modal" data-target="#ui-modal-test">Open</button> 

    <!-- Kube JS + jQuery are used for some functionality, but are not required for the basic setup --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
    <script src="dist/js/kube.js"></script> 
</body> 
</html>

जे एस:

$('#ui-modal-form').on('submit', function(event){ 
    event.preventDefault(); // modal still closes before submitting form 

    var field1 = $(this).find('input[name=field1]').val().toLowerCase(); 
    var field2 = $(this).find('input[name=field2]').val(); 
    var field3 = $(this).find('input[name=field3]').val(); 

    $.post('/post.php', { 
     field1: field1, 
     field2: field2, 
     field3: field3, 
    }, function(response){ 
     var response = JSON.parse(response); 

    }); 
});

मैं प्रपत्र चाहते हैं मोडल बॉक्स को बंद किए बिना प्रस्तुत करने के लिए जब प्रयोक्ता आदानों में से किसी पर दर्ज करें।

स्रोत

2017-10-10 Alex. W

लगता है और ठीक काम कर रहा है। मैं बैकएंड से प्रतिक्रिया सबमिट करने और देखने में सक्षम हूं। जब कर्सर किसी भी फ़ील्ड पर है तो मैं सबमिट कर सकता हूं। – TheChetan

अजीब, मैंने क्रोम, एफएफ और आईई में इसका परीक्षण किया है। वही ... क्या आप प्रवेश का उपयोग कर सबमिट कर रहे हैं? –

हां, मैंने माउस के साथ दोनों कोशिश की है और – TheChetan

मुझे क्यूब के बारे में कोई जानकारी नहीं थी, लेकिन मैंने जो कहा वह मैंने कोशिश की, यह एक मुद्दा था। फिर मैंने मोडल को देखने के लिए dist फ़ोल्डर में kube.js फ़ाइल खोली। मैं इस विशेष समारोह पाया लाइन नंबर 2167 पर कारण हो -

handleEnter: function(e) 
    { 
     if (e.which === 13) 
     { 
      e.preventDefault(); 
      this.close(false); 
     } 
    }

13 महत्वपूर्ण घटना दर्ज करने के लिए कोड है। यह क्यूब में डिफ़ॉल्ट रूप से है, मुझे लगता है। हो सकता है कि आप इसे ओवरराइड कर सकें, मुझे लगता है कि घटनाओं को अक्षम करने के लिए इसमें कुछ फ़ंक्शन हैं। अगर मैं इस this.close(true) जैसे पैरामीटर को बदलता हूं, तो यह अच्छी तरह से काम करता है।

आशा है कि यह आपको कारण क्यों हो रहा है इसका कारण बताता है।

Kube मैं अपने कंप्यूटर पर एक ही बात को दोहराया अच्छा :)

स्रोत

2017-10-20 22:48:25

लाइन 703 में, आप करीबी कार्य की परिभाषा देख सकते हैं। झूठी गुजरने से, यह डिफ़ॉल्ट व्यवहार को रोकने के लिए पहली जांच छोड़ देता है। सच होने से इस मामले में इस मुद्दे को हल किया जाता है। यह एक तरीका है जिसे मैंने हल करने के लिए पाया, कुछ और हो सकता है। –

मुझे एक त्रुटि मिलती है: 'TypeError: e.preventDefault लाइन 2004 पर फ़ंक्शन नहीं है लेकिन कम से कम मोडल बंद नहीं होता है !! –

कभी नहीं, पूरे फ़ंक्शन को हटाने से समस्या ठीक हो जाती है :) –

  <form onSubmit={event => event.preventDefault()}> 
       <input type="text" name="field1"> 
       <input type="text" name="field2"> 
       <input type="text" name="field3"> 
       <button>Apply</button> 
      </form>

आप भी अगर अभी भी काम नहीं उल्लेख कर सकते हैं:

सबमिट की आवश्यकता नहीं है, तो आपके मामले में मैं beforeSubmit करने पर अपने तर्क जाने का सुझाव देते हैं और हमेशा अवास्तविक लौटाते के रूप में इस मॉडल से पहले शुरू हो रहा है बंद कर देता है। वर्तमान में, मोड मोडल को ट्रिगर करने के अलावा मैन्युअल रूप से मोडल को बंद करने का कोई तरीका नहीं है: नष्ट करें। यह एक उदाहरण है:

var Modal = Backbone.Modal.extend({ 
    template: _.template($('#modal-template').html()), 
    submitEl: 'button', 
    beforeSubmit: function() { 
    // show your awesome loader here 
    this.model.save(this.model.attributes, success: function() { 
     this.trigger('modal:destroy'); 
    }); 
    return false; 
    } 
});

आपका मोडल प्रस्तुत नहीं करता है अगर यह सफल नहीं होता और beforeSubmit केवल onEnter और बटन के onClick शुरू हो रहा है।

स्रोत

2017-10-14 08:38:15

ध्यान से ध्यान दें, तर्क सूची के बाद 'this.model.save (this.model.attributes, सफलता: फ़ंक्शन() {'। 'सिंटेक्स त्रुटि: गायब) पर एक त्रुटि है। आपको यह कोड कहां से मिलेगा? दस्तावेज़ों से कुछ ऐसा लगता है। –

$('input[type=text]').keypress(function (e) { 
    if (e.which == 13) { 
    e.stopPropagation(); 
    $('form').submit(); 
    } 
});

स्रोत

2017-10-14 08:39:59 Osama

पहले जैसा ही व्यवहार है। मैंने यह दिखाने के लिए अपना प्रश्न अपडेट कर दिया है कि यह कैसे सबमिट किया गया है। –

उत्तर

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