troubleshooting Question

Insert form action on key press

Avatar of CAE5942
CAE5942 asked on
JavaScriptAJAX
7 Comments1 Solution556 ViewsLast Modified:
Hi everyone,

I have a form on a web page and I've removed the action part of the form element so that it looks like this:

<form id="catwebformform65782" name="catwebformform65782" method="post" onsubmit="return checkWholeForm65782(this)" enctype="multipart/form-data">

I then use javascript to detect a key press so that the action part is inserted as follows:

$( "#catwebformform65782" ).on( "keypress", function( event ) {
            var action = $("#catwebformform65782").attr("action");
            if ( typeof(action) === "undefined" || action === null || action === "" ) {
                var url = "/FormProcessv2.aspx"
                var params = "?WebFormID=10090&amp;OID={module_oid}&amp;OTYPE={module_otype}&amp;EID={module_eid}&amp;CID={module_cid}";
                $( "#catwebformform65782" ).attr("action",url + params);
            }
});

Open in new window


I test it in the browser by inspecting the form, inserting some text into the first input field, but the action url is not being inserted. I wondered if anyone can help me pinpoint the problem. The full form code is below.

Really appreciate any help.

Thanks in advance.


<form id="catwebformform65782" name="catwebformform65782" method="post" onsubmit="return checkWholeForm65782(this)" enctype="multipart/form-data">
    <div class="item item-third">
    <input type="text" name="FirstName" id="FirstName" class="cat_textbox" maxlength="255" placeholder="First Name" />
    <input type="text" name="LastName" id="LastName" class="cat_textbox" maxlength="255" placeholder="Last Name" />
    <input type="email" name="EmailAddress" id="EmailAddress" class="cat_textbox" maxlength="255" placeholder="Email Address" />
    </div>
    <div class="item item-third">
    <input type="text" name="HomePhone" id="HomePhone" class="cat_textbox" maxlength="255" placeholder="Home Phone" />
    <input type="text" name="WorkPhone" id="WorkPhone" class="cat_textbox" maxlength="255" placeholder="Work Phone" />
    <input type="text" name="CellPhone" id="CellPhone" class="cat_textbox" maxlength="255" placeholder="Mobile Phone" />
    </div>
    <div class="item item-third">
    <input type="text" maxlength="4000" name="CAT_Custom_19935221_134827" id="CAT_Custom_19935221_134827" class="cat_textbox" placeholder="How did you hear about us?" />
    <select name="CAT_Custom_19935223" id="CAT_Custom_19935223" class="cat_dropdown">
    <option value=" ">-- Preferred Contact Method --</option>
    <option value="Phone">Phone</option>
    <option value="Email">Email</option>
    </select>
    </div>
    <div class="item">
    <textarea name="CAT_Custom_869" id="CAT_Custom_869" cols="10" rows="4" placeholder="Comments/Enquiries" class="cat_listbox" onkeydown="if(this.value.length&gt;=4000)this.value=this.value.substring(0,3999);"></textarea>
    </div>
    <div class="item">
    <label>Enter Word Verification in box below <small>(required)</small></label>
    {module_captchav2}
    </div>
    <div class="item">
    <input class="button radius" type="submit" value="Submit" id="catwebformbutton" />
    </div>
    <script type="text/javascript" src="/CatalystScripts/ValidationFunctions.js"></script>
    <script type="text/javascript">
    //<![CDATA[

        $( "#catwebformform65782" ).on( "keypress", function( event ) {
            var action = $("#catwebformform65782").attr("action");
            if ( typeof(action) === "undefined" || action === null || action === "" ) {
                var url = "/FormProcessv2.aspx"
                var params = "?WebFormID=10090&amp;OID={module_oid}&amp;OTYPE={module_otype}&amp;EID={module_eid}&amp;CID={module_cid}";
                $( "#catwebformform65782" ).attr("action",url + params);
            }
});

    var submitcount65782 = 0;

    function checkWholeForm65782(theForm) {
            var why = "";
            if (theForm.FirstName) why += isEmpty(theForm.FirstName.value, "First Name");
            if (theForm.LastName) why += isEmpty(theForm.LastName.value, "Last Name");
            if (theForm.EmailAddress) why += checkEmail(theForm.EmailAddress.value);
            if (theForm.HomePhone) why += isEmpty(theForm.HomePhone.value, "Home Phone Number");
            if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image");
            if (theForm.CAT_Custom_19935223) why += checkDropdown(theForm.CAT_Custom_19935223.value, "Please select your preferred contact method");
            if (theForm.CAT_Custom_19935221_134827) why += isEmpty(theForm.CAT_Custom_19935221_134827.value, "Please tell us how you heard about us?");
            if (why != "") {
                alert(why);
                return false;
            }
            if (submitcount65782 == 0) {
                submitcount65782++;
                theForm.submit();
                return false;
            } else {
                alert("Form submission is in progress.");
                return false;
            }
        }
        //]]>
</script>
</form>

Open in new window

ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 1 Answer and 7 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 7 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros