JQuery ব্যবহার করে - ফর্ম জমা দেওয়া থেকে রোধ করা হচ্ছে

178

Jquery ব্যবহার করে কোনও ফর্ম জমা দেওয়ার থেকে কীভাবে বাধা দেব?

আমি সবকিছু চেষ্টা করেছিলাম - 3 টি পৃথক অপশন দেখুন যা আমি নীচে চেষ্টা করেছি তবে এটি সব কাজ করে না:

    $(document).ready(function() { 

            //option A
            $("#form").submit(function(e){
                e.preventDefault();
            });

            //option B
            $("#form").submit(function(e){
                stopEvent(e);
            });

            //option C
            $("#form").submit(function(){
                return false;
            });
    });

ভুল হতে পারে?

আপডেট - এখানে আমার এইচটিএমএল:

    <form id="form" class="form" action="page2.php" method="post"> 
       <!-- tags in the form -->
       <p class="class2">
           <input type="submit" value="Okay!" /> 
       </p>
    </form>

এখানে কি কিছু ভুল আছে?

jquery forms

— লুসি ওয়েদারফোর্ড
সূত্র

আপনার এইচটিএমএল দেখান কারণ আপনার নির্বাচক সম্পূর্ণরূপে ভুল হওয়া ব্যতীত প্রতিরোধের ডিফল্ট বা মিথ্যা হিসাবে পোস্ট করেছেন তেমন কোনও ভুল নেই।

— স্পার্কি

1

return false;.submit()আমার জন্য কাজ করার পরে ! আমার একই সমস্যা ছিল

— d -_- বি

হ্যান্ডলারের মধ্যে জাভাস্ক্রিপ্টের ত্রুটি থাকলে e.preventDefault();কোডটি পৌঁছানো / সম্পাদন করা হয় না।

— টম

263

দুটি জিনিস দাঁড়ানো:

এটি সম্ভব যে আপনার ফর্মের নামটি নেই form। বরং # টি ড্রপ করে ট্যাগটি দেখুন।
এছাড়াও e.preventDefaultসঠিক জিকুয়েরি সিনট্যাক্স, যেমন
```
    //option A
    $("form").submit(function(e){
        e.preventDefault();
    });
```

অপশন সিতেও কাজ করা উচিত। আমি বি বিকল্পের সাথে পরিচিত নই

একটি সম্পূর্ণ উদাহরণ:

<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

        <script type='text/javascript'>
         $(document).ready(function() {
            //option A
            $("form").submit(function(e){
                alert('submit intercepted');
                e.preventDefault(e);
            });
        });
        </script>
    </head>

    <body>
        <form action="http://google.com" method="GET">
          Search <input type='text' name='q' />
          <input type='submit'/>
        </form>
    </body>
</html>

— ফিলিপ ফৌরি
সূত্র

2

অন্য কিছু ভুল। আমি এই কৌশলটি প্রতিদিন ব্যবহার করছি। সর্বোত্তম অনুমান পৃষ্ঠায় জাভাস্ক্রিপ্ট ত্রুটি আছে, সম্ভবত এটি ফায়ারব্যাগ দিয়ে পরীক্ষা করে দেখুন?

— ফিলিপ ফৌরি

@ লুচি ওয়েদারফোর্ড, আমি আমার উত্তরটি কাজ করে এমন একটি নমুনা দিয়ে আপডেট করেছি। আপনি কিছু স্পট।

— ফিলিপ ফৌরি

আপনার আপডেটে এইচটিএমএল আমি লক্ষ্য করেছি যে আপনার ফর্মের জন্য শ্রেণি বৈশিষ্ট্য রয়েছে। থেকে আপনার jQuery নির্বাচক পরিবর্তন $('#form')করতে $('.form')বর্গ বৈশিষ্ট্যাবলী জন্য।

— ফিলিপ ফৌরি

1

ধন্যবাদ! আমি একই কোডে আপনার কোডটি ব্যবহার করে শেষ করেছি, এবং এটি কার্যকর হয়েছে তবে এখনও কী ভুল ছিল তা নিশ্চিত করে বলা যায় না, তবে এখন এটি বেশ ভাল। ধন্যবাদ!

— লুসি ওয়েদারফোর্ড

1

@ অ্যাঞ্জেলো রিগো ই হ'ল প্যারামিটারে আপনি যে নামটি দেন তা কেবল এই ক্ষেত্রে এটি জমা দেওয়ার ঘটনা।

— squall3d

34

আপনার সম্ভবত পৃষ্ঠায় কয়েকটি ফর্ম রয়েছে এবং $ ('ফর্ম') ব্যবহার করছেন submit পরিবর্তে শ্রেণি নির্বাচক ব্যবহার করুন, বা এটি চেষ্টা করুন:

$('form').each(function(){
    $(this).submit(function(e){
        e.preventDefault();
        alert('it is working!');
        return  false;
    })
})

বা এর আরও ভাল সংস্করণ:

$(document).on("submit", "form", function(e){
    e.preventDefault();
    alert('it works!');
    return  false;
});

— আর্টেম কিসেলভ
সূত্র

1

আমার ক্ষেত্রে, মিথ্যা ফিরিয়ে দেওয়া একটি মূল বিষয় ছিল।

— এলকুইমিস্ট

19

ফর্ম জমা দেওয়ার ব্যবহারকে ডিফল্ট / প্রতিরোধ করতে

e.preventDefault();

ইভেন্ট বুদবুদ ব্যবহার বন্ধ করতে

e.stopPropagation();

ফর্ম জমা দিতে বাধা দিতে 'রিটার্ন মিথ্যা' কাজ করা উচিত।

— আলফা
সূত্র

এই উত্তরটি দেখুন কারণ jQuery এগুলি অন্যভাবে পরিচালনা করে। stackoverflow.com/questions/1357118/…

— স্পার্কি

1

এই পরীক্ষা করে দেখুন ঘটনা bubling বুঝতে quirksmode.org/js/events_order.html

— আলফা

2

উপর jQuery এর এপিআই পদ বলে: "একটি ইভেন্ট হ্যান্ডলার থেকে মিথ্যা রিটার্নিং স্বয়ংক্রিয়ভাবে কল হবে event.stopPropagation()এবং event.preventDefault()একটি। falseমান এছাড়াও জন্য একটি সাঁটে লেখার হিসাবে হ্যান্ডলার জন্য প্রেরণ করা সম্ভব function(){ return false; }।"

— পল

7

আমারও একই সমস্যা ছিল। আপনি যা চেষ্টা করেছিলেন তাও আমি চেষ্টা করেছিলাম। তারপরে আমি আমার পদ্ধতিটি jquery ব্যবহার না করে ফর্ম ট্যাগটিতে "onsubmit" বৈশিষ্ট্যটি ব্যবহার করে পরিবর্তন করি।

<form onsubmit="thefunction(); return false;">

এটা কাজ করে।

তবে, যখন আমি কেবল "thefunction ()" এর মধ্যে মিথ্যা ফেরতের মান রাখার চেষ্টা করেছি, এটি জমা দেওয়ার প্রক্রিয়াটি আটকাবে না, তাই আমাকে অবশ্যই "মিথ্যা প্রত্যাবর্তন" লাগাতে হবে; অনসামিত বৈশিষ্ট্যে। সুতরাং, আমি উপসংহারে পৌঁছেছি যে আমার ফর্ম অ্যাপ্লিকেশন জাভাস্ক্রিপ্ট ফাংশন থেকে রিটার্ন মান পেতে পারে না। এটি সম্পর্কে আমার কোনও ধারণা নেই।

— লুকি বি সুব্যাক্তি
সূত্র

1

এটি false;এবং এর মধ্যে পার্থক্য return false;। আপনার দরকারonsubmit="return thefunction();"

— xr280xr

4

আমার একই সমস্যা ছিল এবং আমি এইভাবে সমাধান করেছি (মার্জিত নয় তবে এটি কাজ করে):

$('#form').attr('onsubmit','return false;');

আমার মতে এটির সুবিধা রয়েছে যে আপনি যে কোনও সময় পরিস্থিতি ফিরিয়ে দিতে পারবেন:

$('#form').attr('onsubmit','return true;');

— vinxxe
সূত্র

ফর্মটি $('#form').removeAttr('onsubmit');

— ফেরত

4

ফর্ম উপাদানটিতে নয় উপাদান জমা দেওয়ার ইভেন্টটিতে ইভেন্টটি সংযুক্ত করুন। উদাহরণস্বরূপ আপনার এইচটিএমএলে এটি করুন

$('input[type=submit]').on('click', function(e) {
    e.preventDefault();
});

— এম ওয়েইস
সূত্র

2

হ্যাঁ দাও সাবজেক্ট দাও যদি অন্যথায় ত্রুটি দেখায় তবে ফর্মটি বৈধ কিনা তা আপনি কেবল খতিয়ে দেখতে পারেন।

এইচটিএমএল

<form id="form" class="form" action="page2.php" method="post">
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />
    <input type="text" class="check-validity" value="" />

    <input type="submit" value="Okay!" />
</form>

জাভাস্ক্রিপ্ট

    $(document).ready(function () {
        var isFormValid = true;

        function checkFormValidity(form){
            isFormValid = true;
            $(form).find(".check-validity").each(function(){
                var fieldVal = $.trim($(this).val());
                if(!fieldVal){
                    isFormValid = false;
                }
            });
        }


        //option A
        $("#form").submit(function (e) {
            checkFormValidity("#form");
            if(isFormValid){
                alert("Submit Form Submitted!!! :D");
            }else{
                alert("Form is not valid :(");
            }
            e.preventDefault();
        });
    });

— কোড স্পাই
সূত্র

1

যখন আমি <form>কোনও বৈশিষ্ট্য ছাড়াই ট্যাগটি ব্যবহার করি id="form"এবং এটিকে সরাসরি তার নাম দিয়ে কল করি যখন এটি সরাসরি আমার সাথে কাজ করে।
এইচটিএমএল ফাইলে আপনার কোড:

<form action="page2.php" method="post">

এবং জ্যাকুরি স্ক্রিপ্টে:

$(document).ready(function() {
      $('form').submit(function(evt){
          evt.preventDefault();// to stop form submitting
      });
 });

— নোহা সালাহ
সূত্র

1

$('#form')সঙ্গে একটি উপাদান সন্ধান করে id="form"।

$('form') ফর্ম উপাদান জন্য সন্ধান করে

— রাহুল
সূত্র

0

আপনি ফর্ম আইডি ভুলে গেছেন, এবং এটি কার্যকর হয়

$('form#form').submit(function(e){
   e.preventDefault();
   alert('prevent submit');             
});

— সিনতাডোনিকু অ্যালিসা
সূত্র

0

// Prevent form submission
$( "form" ).submit(function( event ) {
  event.preventDefault();
});

এখান থেকে: https://api.jquery.com/submit-selector/ (জমা দেওয়ার ধরণের আকর্ষণীয় পৃষ্ঠা)

— ক্রিস স্ট্রং
সূত্র

0

এটি কাজ করে বলে মনে হয় এবং কিছুটা সহজ হতে পারে:

$('#Form').on('submit',function(){
    return false;
})

— Ukuser32
সূত্র

0

JQuery ব্যবহার করে, আপনি নিম্নলিখিতটি করতে পারেন:

1- ইভেন্টটি গুলি চালানো থেকে আটকাতে গিয়ে একটি জমা দিন বোতামের সাহায্যে নেটিভ ফর্ম জমা দিন ইভেন্টটি ব্যবহার করুন

2- ফর্মটি যাচাই করুন বৈধ সম্পত্তি এটি নিম্নলিখিত হিসাবে প্রয়োগ করা যেতে পারে:

1- এইচটিএমএল:

 <form id="yourForm">
    <input id="submit" type="submit" value="Save"/>
</form>

2- জাভাস্ক্রিপ্ট

 $("form").on("submit", function (e) {
        e.preventDefault();
        if ($(this).valid()) {  
           alert('Success!');
        }
    });

— মোহাম্মদ নাগিব
সূত্র