Using custom buttons with js & php - php

How can I make a form with my own "submit" button & post the info to a php server side?
how can I get js to post it?

You can use the submit() method to submit forms via javascript:
document.form_name.submit();
Or:
document.getElementById('form_id').submit();
Or:
document.forms[0].submit(); // submit first form on page
document.forms[1].submit(); // submit second form on page
If you don't want to use a submit button and want to use a normal button, you just need to put any of the above code in onclick event of that button.

<form id=myForm action=process.php>
<input name=text>
<INPUT TYPE="image" SRC="images/submit.gif">
</form>
To submit
document.getElementById('myForm').submit();

Related

AJAX submit function with alert does not work

im trying to get an ajax submit function to work. i cant find what the issue is here. the button for submit is inside a table inside a form
i tried using alert to see if its working but it still not.
the method-
$("#submit").submit(function(){//comparing the total quoted hours with duration of time selected
alert("DEMO TEST");
// code for the comparing values goes here but that's another
//story
});
the submit button-
<input type="submit" name="submit" value="submit" id="submit" onclick="index.php">
obviously the alert should pop an alert with DEMO TEST.
i dont know where im going wrong
It just because of you are calling submit event. When you call submit event your form will submit. you need to take id and class of form like.
<form action="" id="formsubmit">
<input type="submit" value="Submit"> //Remove name="submit" onclick="index.php"
</form>
$("#formsubmit").submit(function(){
alert("DEMO TEST");
});
You have to point the .submit to your form, not your button.
More info on how submit works on jQuery https://api.jquery.com/submit/
jQuery on click event is getting triggered first as onclick="index.php" so remove it and submit the form then it will work.or if you want that event to be trigerred you should return true. or you can submit form using jQuery using .submit() and after submitting the form you can use location.href

How can I submit a form using an image in php

I want to submit a form to the database and I want to use a sprite image instead of regular submit buttons..
Here is the images I'm using
<div class="cancel">
</div>
<div class="save_and_new">
</div>
<div class="save_and_quit">
</div>
if(isset(......)){
}
I have no idea what to put in the isset function ...
Do i need to set names to the images? or what?
You could just use
<input type="image src="/your/button/image/here.gif" />
instead of the images nested inside anchors.
The only problem would be that you can't directly sense which button exactly was pressed because <input type="image" /> does not post a value. If you really need multiple post buttons that also post a value:
<button name="button" value="action1"><img src="/your/image/here.gif" alt="action 1" /></button>
<button name="button" value="action2"><img src="/your/image/here.gif" alt="action 2" /></button>
You can do it in Jquery. Try this,
$("#save_and_new_btn").click(function() {
$("#form").submit();
});
#form is id of form
Generally, a form is submitted when the user presses a submit button. However, sometimes, you may need to submit the form programmatically using JavaScript.
JavaScript provides the form object that contains the submit() method. Use the ‘id’ of the form to get the form object.
For example, if the name of your form is ‘myform’, the JavaScript code for the submit call is:
document.forms["myform"].submit();
But, how to identify a form? Give an id attribute in the form tag
<form id='myform' action='formmail.pl'>
Here is the code to submit a form when a hyperlink is clicked:
<form name="myform" action="handle-data.php">
Search: <input type='text' name='query' />
Search
</form>
<script type="text/javascript">
function submitform()
{
document.myform.submit();
}
</script>
Source: How to Submit a Form Using JavaScript
You need to use javascript.
Find a form which has to be submitted. Then add actions to each elements. Whene they're clicked you are submitting (or canceling) form.

Run a Function From a Form

I want to add a function to a form, so when the submit button is clicked, a function is executed instead of leaving the page.
And I can not use $_POST, because I need the url.
Here is my script :
function submitclicked()
{
echo 'Hello World';
}
<form action="" method="post" id="TransactionAddForm">
<input type="hidden" id="TransactionAccountID" value="'.$zpid.'" name="data[Transaction][account_id]">
<input type="hidden" id="TransactionAmount" value="'.$_POST['price'].'" name="data[Transaction][amount]">
<input type="hidden" id="TransactionDesc" value="'.$desc.'" name="data[Transaction][desc]">
<input type="hidden" id="TransactionRedirectUrl" value="'.$backurl.'" name="data[Transaction][redirect_url]">
<div class="submit"><input type="image" src="http://www.zarinpal.com/img/merchant/merchant-6.png" ></div>
</form>;
Tnx for your help.
Your basic understanding is flawed. PHP is a server side language, meaning, it runs on the server side. It cannot capture button clicks or browser events. It can only work with requests from the client to the server.
Your function may only run after the form was submitted to the server.
For your problem, use JavaScript.
Also, what you have here is not a form. The user has no form controls to choose from here.
Add a return false; at the end of the function you call on submit. This way, the form will not be submitted. You can also add a simple button, which is the type button, and not the type submit. Those buttons will also not submit the form.
-- EDIT --
I am assuming you want to call a JavaScript function on the click of your submit button. any PHP is of course server-side...

Issue with POST values in jQuery dialog

<form>
<input type='submit' name='btn1' value='btn1' onclick='javascript:return test()' />
</form>
function test(){
$('#testDiv').dialog('open');
}
Dialog have 2 buttons 'OK' & 'cancel'
On the 'OK' button I have written .submit() which is working fine.
But the issue is when values are posted to .php file $_POST['btn1'] is not set. Which would have been set if there is no function called on OnClick event and the submit button had been directly triggered.
Can anyone help?
yes, if you do manual jQuery submit , i.e) by calling $("#formid").submit(); your submit button will not present in POST values but all other values will present.
This Issue I have noticed while am working on jquery Ajax captcha.
You can confirm that by putting one or two hidden values and check your POST values.
put some value in your submit button.
<input type="submit" name="submit" value="submit" onclick="... do whatever"/>

Submit form in PHP using Hit Enter

I am using an image instead of a submit button for search option and use onclick events to load the results using ajax in php.Now I need to load results by hit enter also.Is their any ways to update my application without changing the image.
Thanks
Sure, add <input type="submit" style="display:none;" /> to the end of your form, should trick the browsers into allowing the Enter key to submit your form.
As far as getting the same functionality as your AJAX onclick event: You should be tying your ajax function to the <form>'s submit event instead of the <input>'s click event.
jsfiddle demonstration (uses jQuery for ajax ease, but your event doesn't have to)
I don't know what javascript library you're using, but I'll use jQuery in my example.
<script>
$(document).ready(function() {
$("form#interesting").bind("submit",function() {
$.get("target_page.php".function() {
// Callback functionality goes here.
});
});
});
</script>
<form id="interesting">
Enter your input: <input type="text" name="interesting_input" />
<!-- input type="image" is a way of using an image as a submit button -->
<input type="image" src="submit_button_image.gif" />
</form>
Hmm, There are several things I can think about.
fitst one - someone mentioned that you can style submit button as an image. Good idea and it's easy. this tutorial was posted as an answer some time ago http://www.ampsoft.net/webdesign-l/image-button.html .
Another problem is, you bind your submit event to onclick, but the natural submit for form is onsubmit. So if you hit enter on form input the form receives onsubmit event. You have to bind your JS to it.
It works genrally as in answer from #phleet when you use jquery, when you don't use any library, you can do something like
<form onsubmit="YOUR_JS_HERE">.....</form>
like in onclick. I also recommend using jQuery, though.

Categories