Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Dipa 88 posts 370 karma points
    Dec 26, 2015 @ 06:46
    Dipa
    0

    Prevent button double click event in IsPost

    Hello,

    I have one form. Coded like below :

    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
    @using System;
    @using System.Linq;
    @using System.Net.Mail;
    @{
        if (IsPost)
        {
            //Other code to submit form
        }
    }
    <body>
        <div >
            <div>
                <form method="post" autocomplete="off">
                    <table class="FormTable">
                        <tbody>
                            <tr>
                                <td>
                                    Your Name <span style="color: #ff0000;">*</span>
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <input name="txtyourname" type="text" maxlength="50" id="txtyourname" class="InputTextBox" required /><br />
                                    <span id="Rqfullname" class="Error" style="visibility:hidden;">Please enter Your Name</span>
                                </td>
                                <td>
                                    Designation
                                </td>
                                <td>
                                    :
                                </td>
                                <td>
                                    <input name="txtdesignation" type="text" maxlength="50" id="txtdesignation" class="InputTextBox" />
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    &#160;
                                </td>
                                <td>
                                    &#160;
                                </td>
                                <td style="text-align: right">
                                    <input type="submit" name="btnsubmit" value="Submit" id="btnsubmit" class="SubmitBtn" />
                                </td>
                                <td style="text-align: left">
                                    <input type="reset" name="Butreset" value="Reset" id="Butreset" class="SubmitBtn" />
                                </td>
                                <td>
                                    &#160;
                                </td>
                                <td>
                                    &#160;
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </form>
            </div>
    
        </div>
    </body>
    

    Form is getting submit properly, But now I want that that when it enter into IsPost then submit button should get disable(double click prevent). Not able to find method for it.

    Help me with how to do it.

    Thanks,

    Dipa

  • Phil Whittaker 63 posts 267 karma points MVP 4x c-trib
    Dec 26, 2015 @ 09:03
    Phil Whittaker
    0

    You can do this using Javascript, the quickest, easiest (and dirtiest) way is to add an onlick event to the submit button

    <input type="submit" name="btnsubmit" value="Submit" id="btnsubmit" class="SubmitBtn" onclick="this.disabled = true;document.getElementById("myForm").submit()" />
    

    you will also need to add a name to the form

    <form method="post" name="myForm" autocomplete="off">
    

    As I said before this is a bit quick and dirty. I would recommend using jquery to do this properly

    http://www.w3schools.com/jquery/

    But the above way shows the right ideas.

  • Stefan Kip 1614 posts 4131 karma points c-trib
    Dec 26, 2015 @ 09:44
  • Dipa 88 posts 370 karma points
    Dec 26, 2015 @ 10:30
    Dipa
    100

    Hello,

    Thanks for help.

    I found solution with this also.

    $(document).on('submit', 'form', function () {
            document.getElementById("btnsubmit").disabled = true;
        });
    

    Thanks

Please Sign in or register to post replies

Write your reply to:

Draft