ফর্ম জমা দেওয়া বন্ধ করতে জাভাস্ক্রিপ্ট কোড


205

ফর্ম জমা দেওয়া বন্ধ করার এক উপায় হ'ল আপনার জাভাস্ক্রিপ্ট ফাংশন থেকে মিথ্যা ফিরিয়ে দেওয়া।

জমা দেওয়ার বোতামটি ক্লিক করা হলে, একটি বৈধতা ফাংশন বলা হয়। ফর্ম বৈধতার ক্ষেত্রে আমার একটি মামলা রয়েছে have যদি এই শর্তটি পূরণ হয় তবে আমি রিটার্নটোপ্রিজিপেজ () নামে একটি ফাংশন বলি ;

function returnToPreviousPage() {
    window.history.back();
}

আমি জাভাস্ক্রিপ্ট এবং ডোজো টুলকিট ব্যবহার করছি ।

আগের পৃষ্ঠায় ফিরে গিয়ে, এটি ফর্মটি জমা দেয়। আমি কীভাবে এই জমাটি বাতিল করতে এবং পূর্ববর্তী পৃষ্ঠায় ফিরে যেতে পারি?


আরইউ নিশ্চিত যে এই ফাংশনটি কল করছে ?? সতর্কতা রাখার চেষ্টা করুন ('পরীক্ষা'); উইন্ডো হিস্টোরির আগে
সমিপ্রোগ্রামার

হ্যাঁ আমি নিশ্চিত; এটি বলা হচ্ছে
মুহাম্মদ ইমরান তারিক

উত্তর:


291

ফর্ম জমা আটকাতে আপনি ফাংশনের রিটার্ন মানটি ব্যবহার করতে পারেন

<form name="myForm" onsubmit="return validateMyForm();"> 

এবং মত কাজ

<script type="text/javascript">
function validateMyForm()
{
  if(check if your conditions are not satisfying)
  { 
    alert("validation failed false");
    returnToPreviousPage();
    return false;
  }

  alert("validations passed");
  return true;
}
</script>

উপরের কোডটি যদি কাজ করে না তবে ক্রম 27.0.1453.116 মিটার ক্ষেত্রে, দয়া করে ইভেন্ট হ্যান্ডলারের প্যারামিটারের রিটার্নভ্যালু ক্ষেত্রটি এটিতে কাজ করতে মিথ্যাতে সেট করুন

তথ্য ভাগ করে নেওয়ার জন্য স্যাম ধন্যবাদ।

সম্পাদনা:

যদি বৈধতাযুক্ত MyForm () মিথ্যা ফেরত দেয় তবে তার কাজের জন্য বিক্রমকে ধন্যবাদ:

 <form onsubmit="event.preventDefault(); validateMyForm();">

যেখানে বৈধতা মাইফর্ম () এমন একটি ফাংশন যা বৈধতা ব্যর্থ হলে মিথ্যা ফিরিয়ে দেয়। মূল বিষয় হ'ল নাম ইভেন্টটি ব্যবহার করা। আমরা ইজপ্রিভেন্ট ডেফল্ট () এর জন্য ব্যবহার করতে পারি না


1
কেবলমাত্র অনুমান: ক্রোমের সর্বশেষতম সংস্করণে এটি আমার পক্ষে কাজ করে না।
স্যাম

5
প্রত্যাবর্তনের যে falseকোনও কিছুর কোনও প্রভাব আছে বলে মনে হয় না; ক্রোম এখনও ফর্মটি জমা দেয়। উদাহরণস্বরূপ onsubmit="return false;",। তবে ইভেন্ট হ্যান্ডলারের প্যারামিটারের returnValueক্ষেত্রটি সেট করা falseআমার পক্ষে কাজ করে।
স্যাম

3
হাই স্যাম / হেমন্ত, কীভাবে ইভেন্ট হ্যান্ডলারের প্যারামিটারের রিটার্নভ্যালু ক্ষেত্রটি মিথ্যাতে সেট করতে হয় তার জন্য কোড নমুনা সরবরাহ করতে পারেন।
জ্যাকডেভ

2
আমি মনে করি যেহেতু এটি গৃহীত উত্তর, সম্ভবত এটি সঠিকভাবে কীভাবে করা যায় তা বলা উচিত। জ্যাকডেভের সাথে আমিও ভাবছি যে কীভাবে এটি সঠিকভাবে কাজ করা যায়। যেমনটি, এটি কাজ করে না
ক্রুঙ্কার

1
যদি validateMyForm()ত্রুটি আছে return falseপৌঁছেছেন করা হবে না। সুতরাং এটি ব্যর্থ হতে পারে। অনেক ঘন্টা পরে, আমি একটি সমাধান খুঁজে পেয়েছি যা কাজ করে এবং এটি নীচে পোস্ট করেছে।
বিক্রম পুদি

116

ডিফল্ট প্রতিরোধ ব্যবহার করুন

ডোজো টুলকিট

dojo.connect(form, "onsubmit", function(evt) {
    evt.preventDefault();
    window.history.back();
});

jQuery এর

$('#form').submit(function (evt) {
    evt.preventDefault();
    window.history.back();
});

ভ্যানিলা জাভাস্ক্রিপ্ট

if (element.addEventListener) {
    element.addEventListener("submit", function(evt) {
        evt.preventDefault();
        window.history.back();
    }, true);
}
else {
    element.attachEvent('onsubmit', function(evt){
        evt.preventDefault();
        window.history.back();
    });
}

3
আমি অনেক কারণেই মিথ্যা রিটার্নের চেয়ে ইভেন্ট.প্রিভেন্ট ডেফল্ট () এর সুপারিশ করব, এটির শীর্ষ উত্তরটি হওয়া উচিত: blog.nmsdvid.com/…
এসিডজাজ

1
ভাল উত্তর. নির্বাচিত একজনের চেয়ে ভাল।
অনি মেনন

2
ভাল, তবে আপনি ওপি যে বৈধতাটি চান তা কোথায় সম্পাদন করবেন?
সাহান্দ

1
@acidjazz তবে কীভাবে কেউ ডিফল্ট প্রতিরোধের পরে ফর্ম ডেটা অ্যাক্সেস করতে পারে?
CodeAt30

@ সাহানড @ কোডাট 30 আপনি ইভেন্টটি অ্যাক্সেস করতে পারবেন target
এড্রিয়েন

49

নিম্নলিখিতটি এখন পর্যন্ত কাজ করে (ক্রোম এবং ফায়ারফক্সে পরীক্ষিত):

<form onsubmit="event.preventDefault(); validateMyForm();">

যেখানে ভ্যালিডেটমাইফর্ম () এমন একটি ফাংশন যা falseবৈধতা ব্যর্থ হলে ফিরে আসে । মূল বিষয়টি হল নামটি ব্যবহার করা event। আমরা যেমন ব্যবহার করতে পারি না e.preventDefault()


15

buttonসাবমিট বোতামের পরিবর্তে কেবল একটি সাধারণ ব্যবহার করুন । এবং ফর্ম জমা হ্যান্ডেল করতে একটি জাভাস্ক্রিপ্ট ফাংশন কল করুন:

<input type="button" name="submit" value="submit" onclick="submit_form();"/>

একটি scriptট্যাগ মধ্যে ফাংশন :

function submit_form() {
    if (conditions) {
        document.forms['myform'].submit();
    }
    else {
        returnToPreviousPage();
    }
}

আপনি চেষ্টা করতে পারেন window.history.forward(-1);


আমি এই পদ্ধতির পছন্দ করি কারণ এটি আমার ব্যবহারের ক্ষেত্রে, কলব্যাকগুলিকে অনুমতি দেয়।
এডি

12
এটি ফর্ম জমা দেওয়ার জন্য এন্টার কী ব্যবহার করা বাধা দেয়। এছাড়াও, নতুন এইচটিএমএল 5 টি বৈশিষ্ট্য যেমন requiredকাজ করবে না।
স্যাম

8

একটি সহজ কাজ করার জন্য প্রচুর কঠোর উপায়:

<form name="foo" onsubmit="return false">

3
এই সঠিক উত্তরটি (ঠিক আছে, সঠিক নয়, যেহেতু আপনার একটি অর্ধ-কোলন অনুপস্থিত) 8 মাস আগে জমা দেওয়া হয়েছিল, এবং ভাল কারণে নেতিবাচক ভোট রয়েছে। এটি বেশিরভাগ সময় কাজ করে। তবে সব সময় সমস্ত ব্রাউজারে নয়
অস্পেক্স

3
আমি বলিনি যে আপনার একটি সেমিকোলন দরকার ছিল ; আমি উল্লেখ করেছিলাম যে এটিই ছিল আপনার উত্তর এবং অনেক পুরানো প্রশ্নের মধ্যে আলাদা different আপনি এখন আমাকে কোন ব্রাউজারগুলি সমর্থন করে না তা নির্দেশ করার জন্য জিজ্ঞাসা করছেন (আমি কখনও বলিনি যে সেখানে কোনটি ছিল না, আমি কেবল উল্লেখ করেছি যে এটি সর্বদা কাজ করবে না), প্রমাণ করে যে আপনি এখনও এই পুরো পৃষ্ঠাটি পড়েন নি ।
অস্পেক্স

2
আমি সাধারণত ডাউন-ভোটগুলি পরীক্ষা করি না, তবে আমি জানতাম না যে লোকেরা সঠিক ভোট ডাউন ভোটদান করছে were প্রযুক্তিগতভাবে, সেমিকোলন বহিরাগত, তাই এটি ভুল। এবং আপনি বলেছিলেন যে "আপনার সেমিকোলন অনুপস্থিত" ইঙ্গিত করে যে এটির প্রয়োজন আছে যা ভুল। আপনি বলছেন এটি "সর্বদা কাজ করবে না" তবে আপনি কোনও একক কেস বা ব্রাউজারটি এটি কাজ করতে পারবেন না যেখানে এটি কাজ করবে না? এটা কি শব্দ যুক্তি? এটি সঠিক কোড। সুতরাং যদি না আপনি কেসটি এটি কাজ করে না যেখানে এটি নির্দেশ করতে না পারেন তবে আপনার বিন্দু মোটেই থাকবে না।
ড্যানিয়েল

এটির কীভাবে আরও উপাখ্যান নেই? অন্যান্য উদাহরণগুলির তুলনায় এটি অনেক বেশি পরিশ্রুত।
সাল আলতুরাইজি

সম্ভবত কারণ লোকটি আসলে কী জিজ্ঞাসা করছে শিরোনামটির সাথে মেলে না।
ড্যানিয়েল

6

আপনার সমস্ত উত্তর কাজ করার জন্য কিছু দিয়েছে।

অবশেষে, এটি আমার জন্য কাজ করেছে: (আপনি যদি কমপক্ষে একটি চেকবক্স আইটেম চয়ন না করেন তবে এটি সতর্ক করে এবং একই পৃষ্ঠায় থাকবে)

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <form name="helloForm" action="HelloWorld" method="GET"  onsubmit="valthisform();">
            <br>
            <br><b> MY LIKES </b>
            <br>
            First Name: <input type="text" name="first_name" required>
            <br />
            Last Name: <input type="text" name="last_name"  required />
            <br>
            <input type="radio" name="modifyValues" value="uppercase" required="required">Convert to uppercase <br>
            <input type="radio" name="modifyValues" value="lowercase" required="required">Convert to lowercase <br>
            <input type="radio" name="modifyValues" value="asis"      required="required" checked="checked">Do not convert <br>
            <br>
            <input type="checkbox" name="c1" value="maths"     /> Maths
            <input type="checkbox" name="c1" value="physics"   /> Physics
            <input type="checkbox" name="c1" value="chemistry" /> Chemistry
            <br>

            <button onclick="submit">Submit</button>

            <!-- input type="submit" value="submit" / -->
            <script>
                <!---
                function valthisform() {
                    var checkboxs=document.getElementsByName("c1");
                    var okay=false;
                    for(var i=0,l=checkboxs.length;i<l;i++) {
                        if(checkboxs[i].checked) {
                            okay=true;
                            break;
                        }
                    }
                    if (!okay) { 
                        alert("Please check a checkbox");
                        event.preventDefault();
                    } else {
                    }
                }
                -->
            </script>
        </form>
    </body>
</html>

আমার জন্যও কাজ করেছেন।
চেতন

4

@ বিক্রম পুদি উত্তরের ভিত্তিতে, আমরা খাঁটি জাভাস্ক্রিপ্টের সাহায্যে এটিও করতে পারি

<form onsubmit="submitForm(event)">
    <input type="text">
    <input type="submit">
</form>

<script type="text/javascript">

    function submitForm(event){
        event.preventDefault();


    }
</script>

3

আমি onsubmitস্ক্রিপ্টে কোনও ইভেন্ট না ব্যবহার করার পরিবর্তে এটি সংযুক্ত করার পরামর্শ দেব ।

var submit = document.getElementById("submitButtonId");
if (submit.addEventListener) {
  submit.addEventListener("click", returnToPreviousPage);
} else {
  submit.attachEvent("onclick", returnToPreviousPage);
}

তারপরে preventDefault()(বা returnValue = falseপুরানো ব্রাউজারগুলির জন্য) ব্যবহার করুন।

function returnToPreviousPage (e) {
  e = e || window.event;
  // validation code

  // if invalid
  if (e.preventDefault) {
    e.preventDefault();
  } else {
    e.returnValue = false;
  }
}

আপনি ব্যাখ্যা করতে পারেন কেন আপনি ব্যবহার করবেন না onsubmit?
ফ্রিডম বনানা

হতে পারে এটি কেবল অগ্রাধিকার, তবে যদি সমস্ত ইভেন্ট শ্রোতার বৈশিষ্ট্যগুলি ব্যবহার JSনা করে HTMLব্যবহার করে সংযুক্ত করা হয় তবে ওয়েব পৃষ্ঠার কার্যকারিতাটি বোঝা আমার পক্ষে সহজ মনে হয় । অন্য কারও কোড পড়ার সময় আপনাকে এত বেশি লাফিয়ে পড়ার দরকার নেই
আইজাক আব্রামোভিটজ

কেউ যদি বোতামে ক্লিক করার পরিবর্তে কোনও ইনপুটগুলিতে প্রেস করে? সাধারণ ii এখনও জমা দেয় ...
ব্লুজায়কে

1

বলুন আপনার এর মতো একটি ফর্ম রয়েছে

<form action="membersDeleteAllData.html" method="post">
    <button type="submit" id="btnLoad" onclick="confirmAction(event);">ERASE ALL DATA</button>
</form>

কনফার্মেশন ফাংশনের জাভাস্ক্রিপ্ট এখানে

<script type="text/javascript">
    function confirmAction(e)
    {
        var confirmation = confirm("Are you sure about this ?") ;

        if (!confirmation)
        {
            e.preventDefault() ;
            returnToPreviousPage();
        }

        return confirmation ;
    }
</script>

এটি ফায়ারফক্স, ক্রোম, ইন্টারনেট এক্সপ্লোরার (প্রান্ত), সাফারি ইত্যাদিতে কাজ করে

যদি তা না হয় তবে আমাকে জানান


1
সমন্বয় preventDefault()এবং returnToPreviousPage()নিখুঁত এবং মার্জিত। এটি স্বাভাবিক ক্রিয়াকে বাধা দেয় যেমন আপনি কাজ করতে কোনও ব্যতিক্রমী ক্যাচার ডিজাইন করেন। +1 টি।
1934286

1

হেমন্ত এবং বিক্রমের উত্তরগুলি ক্রোমে সরাসরি আমার পক্ষে কার্যকর হয়নি। ইভেন্ট.প্রিভেন্টডেফল্ট (); স্ক্রিপ্ট পৃষ্ঠাটি জমা দিতে বাধা দেয় না যাচাইকরণের ব্যর্থতা নির্বিশেষে। পরিবর্তে, আমি ইভেন্ট.প্রিভেন্টডিফল্ট () সরানো হয়েছিল; বিবৃতিতে নিম্নলিখিত হিসাবে:

    if(check if your conditions are not satisfying) 
    { 
    event.preventDefault();
    alert("validation failed false");
    returnToPreviousPage();
    return false;
    }
    alert("validations passed");
    return true;
    }

আমাকে সঠিক পথে রাখার জন্য হেমন্ত এবং বিক্রমকে ধন্যবাদ।


আমার জন্যও কাজ করেছেন। ধন্যবাদ।
ivbtar

1

উদাহরণস্বরূপ, আপনি যদি ফর্মটিতে বোতাম জমা দেন তবে এর প্রচার বন্ধ করতে ইনর্ডার করে কেবল ইভেন্ট.প্রিভেন্টডেফল্ট () লিখুন; জমা বাটন বা এন্টার বোতামে ক্লিক করে বলা হয় যা ফাংশন।


0

সহজভাবে এটা ....

<form>
<!-- Your Input Elements -->
</form>

এবং এখানে আপনার JQuery যায়

$(document).on('submit', 'form', function(e){
    e.preventDefault();
    //your code goes here
    //100% works
    return;
});

1
আপনি কি এখানে jquery ব্যবহার করেছেন?
সেলভা গণপতি
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.