allow link tag to be submit like form

<a href="#" onclick="$('#testform').submit()">SALES</a>

Would be easier and simpler to just create a link that passes the values you need "posted"

@Member_2_7969240

Would be easier and simpler to just create a link that passes the values you need "posted"

if the form has lots of post elements, this is just no no!
also, getting the element values and adding together and adding to src element of <a> is too much work...

if the form has lots of post elements, this is just no no!
also, getting the element values and adding together and adding to src element of <a> is too much work...

I would proffer creating forms is a whole lot more work than creating a simple link

And this is not a form, they want to pass some other information along with the link

I would proffer creating forms is a whole lot more work than creating a simple link

probably user has already a form with lots of entries and he wants to use link instead of button...

nobody uses a form to submit a few numeric value to post :)

This is a navigation bar - how much stuff does he need to post...?

If there is a lot then the whole design is wrong in the first place

You don't have to transform the <a> element to <form>.You can do this more easy via JQuery $.post method.
HTML:

<input type="text" id="hidden" />
<ul>
  <a href="#">SALES</a>
  <li><a href="javascript:void(0);" class="sendData">REPORTS</a></li>
  <li><a href="javascript:void(0);" class="sendData">ORDERS</a></li>     
</ul>

Select allOpen in new window

JQuery:

$(document).ready(function(){
//I bind a click event to anchor element
  $('a').on('click',function(e){    
   var className=$(this).attr('class');
//When i clicked the anchor element I set the value of the input via data var
    var data=$('#hidden').val();
// and then I post the data variable via $.post method to appropriate page.php  
    $.post(className+'.php',{ data: data }, function(){
//If the post method is success then the page will reload
    location.reload();   
    });    
  });
});

Select allOpen in new window

Hi Experts!

Thanks for the wonderful feebacks! After I review the solutions I tried them out and can work with my code. Sorry that I didn't provide enough information but the solutions are good enough to get to what I want to accomplish. I adopted Huseyin's method by using the onclick in <a> like this: <a ..... onclick="jsfunction(value)">xxxxx</a> and passing the value I need directly into the jsfunction(). Once the value is in the function I used Julian's method by creating post in that fuction and did a post. This way I could pass the value while posting via form. Thanks all again for the wonderful feedback!

Thanks all for putt'n up with a great effort! Thanks to you that I was able to piece it together to accomplish what I need. Thanks again guys!

Just as a matter of interest why did you use the onclick? Standard practice is to put binding of event handlers in code - keep them out of the markup as shown in my sample?

Hi Julian

I used onclick becuase the code was there already. I am just trying to get that code working and release it. I will need to re-code that section later in my new revised version. Till then I will definitely use ur suggestion as in binding event handlers in code. For now I just need to make that work.

I used onclick becuase the code was there already.

This is the code you posted - no onlick. Seems unnecessary to go an add it when you don't have to.

<ul><a href="#">SALES</a>
   <li><a href="reports.php">REPORTS</a>
   <li><a href="salesOrd.php">ORDERS</a>
     ........................
</ul>

Select allOpen in new window

Thanks Julian^^

I will re-work on that part and have the revised one up. I am still debating if I should use the GET or the POST. Reason I used POST because the all the other pages are using the POST (I just want to follow the same method as in POST). For GET, I don't want the users to tamper with the url string as in using the GET or having the parameters been passed show up in the url.

Sorry about the code example that I posted (was trying not to confuse people with additional necessary codes).  Actual code is like this (just for the <a> tag): <a href="reports.php" title="report" name="report"  class="fa fa-lg fa-fw fa-building" value="1" onclick="jsPost()"><span class="menu-item-parent">REPORTS</span></a>

has a onclick function for processing something so that's why I was wondering if I could do something with the <a> tag. Instead of using href="reports.php?val1=1?....., I could do a POST so I had the <form> tag for POST or see if I can convert the exsiting onclick="jsPost()" into

**************
report.js
**************

function jsPost()
{
$.post() ......
}

After I saw your code, (great pointer which I should've caught it early) as in using the event handler like the one in your code "addEventListener('click', function(e) {" then the <a> tag will be more clean and I can do a POST