Can Form Id be passed as parameter for JQuery?

Question

1.00/5 (1 vote)

See more:

Hello experts,
I want to pass form as parameter on button click.
Below is what I tried

I cannot say "this" Because this has value "Advanced Search"

I actually want to pass form "TireQuickSearch" id and action and its method in button submit.

  <form id="formNewTireSearch" runat="server">
In this form I have ASP:Dropdown Drop down lists
Cascading drop downs
 </form>

XML

<form id="TireQuickSearch" action="DealerTireSearchResults.aspx" method="post"  >
      <input type="hidden" name="FormAction" value="TireQuickSearch" />
     <input type="button" name="SearchButton"  value="Advanced Search"  onclick="return ValidateTireQuickSearch(form id="TireQuickSearch" action="DealerTireSearchResults.aspx" method="post");"  />
     </form>

Can anyone help me please

Posted 11-Mar-15 5:23am

sudevsu

Updated 11-Mar-15 6:06am

v2

Add a Solution

Comments

Sergey Alexandrovich Kryukov 11-Mar-15 11:39am

Not clear. What's the problem?
—SA

ZurdoDev 11-Mar-15 11:40am

Why would you pass in the form id?

4 solutions

Solution 2

You can pass anything as a function argument. And in JavaScript, you can pass any argument to any function, even this argument is not declared, the only problem is what this function does. It has nothing to do with jQuery.

As to using "this"… This feature is very important but almost irrelevant to your problem. It's just the implicit function argument passed to a JavaScript function. What it references depends on the context, but it similar but not exactly the same as "this" in traditional OOP languages, in particular, because functions in JavaScript are first-class citizen objects. Please see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this[^].

See also: http://en.wikipedia.org/wiki/First-class_citizen[^].

As to your particular problem, it seems artificial to me; you just need to learn a bit more of general programming and JavaScript programming, not specifically jQuery. If you provide more detail, we can discuss more detailed solutions.

—SA

Posted 11-Mar-15 5:39am

Sergey Alexandrovich Kryukov

Updated 11-Mar-15 5:49am

v3

Solution 3

<input type="button" name="SearchButton"  value="Advanced Search"  onclick="return ValidateTireQuickSearch(this.form.id, this.form.action);"  />

XML

<script type="text/javascript">
    function ValidateTireQuickSearch(id, action)
    {
        alert (id + " - " + action);
        return false;
    }

Posted 11-Mar-15 5:47am

F-ES Sitecore

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Accepted Answer · 2015-03-11T05:38:00

Solution 1

Pass this to the function, and use the form property[^] to access the parent <form> tag.

JavaScript

function ValidateTireQuickSearch(theButton)
{
    var theForm = theButton.form;
    ...
}

Or, pass this.form to the function:

HTML

<input type="button" name="SearchButton"  value="Advanced Search" onclick="return ValidateTireQuickSearch(this.form);"  />

Posted 11-Mar-15 5:38am

Richard Deeming

Comments

sudevsu 11-Mar-15 12:07pm

Hey Richard, this doesn't work if we have two forms. It is considering parent form. Instead I want to pass the form where button is in.
can you tell me how to achieve this?

Richard Deeming 11-Mar-15 12:31pm

The button can only be in a single form. You can't nest forms in HTML.

sudevsu 11-Mar-15 14:57pm

Worked thank you

Peter Leow · Accepted Answer · 2015-03-11T06:25:00

Try this:

XML

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#btnSearch").click(function(){
         var frm = $(this).parent();
        alert(frm.attr('id'));
        alert(frm.attr('action'));
        alert(frm.attr('method'));
    });
});
</script>
</head>
<body>

  <form id="formNewTireSearch" runat="server">
In this form I have ASP:Dropdown Drop down lists
Cascading drop downs
 </form>

<form id="TireQuickSearch" action="DealerTireSearchResults.aspx" method="post"  >
     <input type="hidden" name="FormAction" value="TireQuickSearch" />
     <input type="button" id="btnSearch" name="SearchButton"  value="Advanced Search">
     </form>

</body>
</html>

1. Assign an id to the button, say "btnSearch"
2. In the jQuery, find the parent of this button, that is the form and you can spit out any attribute of this form object.
Read more: jQuery Tutorial[^]