user7748427
user7748427

Reputation:

How to reset the form after confirmation

This code is a Travel Form, I want to reset all inputs form after confirmation (Radios, Checkbox, Text). How to force the user to fill all input fields before submission? I hope you will help me. Kind Regards.

$(document).ready(function () {
$('#submit').click(function () {

    var a = $('#first').val();
    var b = $('#last').val();
    var c = $('#age').val();
    var d = $('#male').val();
    var e = $('input[name=radAnswer]:checked').attr('id');
    var f = $('input[name=che1]:checked').attr('id');
    var z = [];

    if ($('#Vegetarian').is(':checked'))
        z.push($('#Vegetarian').val());

    if ($('#Kosher').is(':checked'))
        z.push($('#Kosher').val());

    if ($('#Masters').is(':checked'))
        z.push($('#Masters').val());

    $.confirm({
        animation: 'news',
        closeAnimation: 'news',
        theme: 'supervan',
        title: 'Confirm! Are you sure to Continue?',
        content: "First name: " + "&nbsp" +
            a + "<br>" + "Last name: " + "&nbsp" + b + "<br>" + "Age: " + 
"&nbsp" + c + "<br>" + "Gender: " + "&nbsp" + e + "<br>" + "Traveling to: " 
+ "&nbsp" + f + "<br>" + "Food type: " + "&nbsp" + z,

        buttons: {
            confirm: function () {
                $.alert('Confirmed!<br><br>Kind Regards.');
            },
            cancel: function () {
                $.alert('You Canceled!!!, Travel to Hell :)');
            }
        }
    });

My Form

Upvotes: 2

Views: 248

Answers (3)

To reset form use $('formElementId').reset(). To prevent form submit put required attribute on input's and use $('formElementId').submit(//put your handler here) instead of click.

Upvotes: 0

user1861458
user1861458

Reputation:

For text inputs, you can use $.val(""). For checkboxes and radio buttons, use $.attr("checked", false)

You can add this into your code where you want it to clear the inputs:

$("input[type='text']").val("");
$("input[type='radio'],input[type='checkbox']").attr("checked", false);

If you're using the form in conjunction with an AJAX script, make sure that you clear the inputs after it's been sent through.

Upvotes: 0

DSCH
DSCH

Reputation: 2396

For your reset issue you can look at: http://api.jquery.com/reset-selector/ TL;DR - $('#yourFormId').trigger("reset"); As for the validation, you can prevent submitting a form by adding the required attribute to each input field. e.g. <input type="text" name="name" required>. Thou, it depends on your form markup in your HTML.

Upvotes: 1

Related Questions