i have form in which i want three functionality among two is working. First one is when form gets submit fetch data from db and display on form_process.php file and second is store form data in db on submit, this two is working fine in form_process.php. Now i want to send all form data via email so i want to do process in email_process.php. So how should i call email_process.php ?
i am already using form action for form_process.php
<form class="cost_calculation" action="form_process.php" name="cost_estimation" id="cost_estimation" method="post">
submit button:
<div class="get_quote_btn">
<input class="get_quote" name="submit" id="getquote" type="submit" value="Get Quote" />
</div>
I tried using ajax but it's not working
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").click(function(){
$.ajax({url: "email_process.php", success: function(result){
$("#cost_estimation").html(result);
}});
});
});
</script>
Thanks in advance.
Related
I have a form that when I submit it I want to load the result page into a div on the original page. When I click the submit button of the form however it is sending a get requst to the original page eg: http://localhost/hr/index_admin_test.php?posteddate=01-10-2015 rather than a post request to http://localhost/hr/attendanceform2.php
In the original page I have the following script:
<script>
$('#timesheetsearch form').submit(function(){
var data=$(this).serialize();
// post data
$.post('attendanceform2.php', data , function(returnData){
$('#timesheets').html( returnData)
})
return false; // stops browser from doing default submit process
});
</script>
And in the body of the page I have the following form and div:
<div class="content_text" id="timesheetsearch">
<p> Select the date you wish to view time sheets for:</p>
<p><form name="timesheetsearch"> <br><input name="posteddate" value="01-10-2015" id="datepicker" />
<div id="timesheets"></div>
<input type="submit"> </form> </p>
Place the script after the form like this
<div class="content_text" id="timesheetsearch">
<p> Select the date you wish to view time sheets for:</p>
<p><form name="timesheetsearch"> <br><input name="posteddate" value="01-10-2015" id="datepicker" />
<div id="timesheets"></div>
<input type="submit"> </form> </p>
<script>
$('#timesheetsearch form').submit(function(){
var data=$(this).serialize();
// post data
$.post('attendanceform2.php', data , function(returnData){
$('#timesheets').html( returnData)
})
return false; // stops browser from doing default submit process
});
</script>
If you run your script before loading the form it will not work since script didn't find any form. You can also write your script inside
$(document).ready(function(){
})
If you really want your script to place before the form. Hope your script is working correctly now.
1st you can try
<form method="post" action="attendanceform2.php" name="timesheetsearch">
2nd try
$(document).on('submit','#timesheetsearch form',function(e){
e.preventDefault();
3rd check your attendanceform2.php file path
4th use it with 1st
<script>
$(document).ready(function(){
$('#timesheetsearch form').submit(function(){
//or you can use this instead>> $(document).on('submit','#timesheetsearch form',function(e){
e.preventDefault();
var data=$(this).serialize();
// post data
$.post('attendanceform2.php', data , function(returnData){
$('#timesheets').html( returnData);
});
return false; // stops browser from doing default submit process
});
});
</script>
I've got a request to figure out if it's possible to send excisting HTML forms to an external service without losing the current form handling on the website.
Basically the idea is:
Visitor fills in form
Form data is send to external webapplication which does it's own form handling
Form continues to execute it's own POST data on the website itself (sending emails to visitor etc)
I'm looking for some input on step 2. I'm requested to build a simple dashboard that saves all the form data with an export functionality but they want to keep all the current form handling on the website as well.
I'm hoping someone can give me some input on what to look for as in keywords to google or some techniques to check out.
Thanks in advance
Maybe the following code is helpfull
<html>
<head>
<script language="Javascript">
<!--
function OnButton1()
{
document.Form1.action = "response1.php"
// document.Form1.target = "_blank"; // Open in a new window
document.Form1.submit(); // Submit the page
return true;
}
function OnButton2()
{
document.Form1.action = ""
document.Form1.submit(); // Submit the page
return true;
}
-->
</script>
<noscript>You need Javascript enabled for this to work</noscript>
</head>
<body>
<!-- create the form -->
<form name="Form1" method="post">
<!-- Add the data entry bits -->
Your Name <input type="text" name="name" size="10" /><br />
<!-- Add some buttons -->
<INPUT type="button" value="Button1" name=name onclick="OnButton1(); OnButton2();">
<!-- close the form -->
</form>
</body>
</html>
Found it here
Idea is to read the data that is needed to post and to the external and local site first then post it with help of AJAX request that would be much better (as shown below).
Or have two forms once user click submit populate both forms and the submit request programatically.
<div>
<form action="" id="helloForm">
Enter Text: <input type="text" id="txt" />
<input type="button" value="submit" id="submitButton"/>
</form>
</div>
$("#submitButton").click(function(e){
//extract data
var data = {
text: $("#txt").val()
};
alert(JSON.stringify(data));
//make external request one
$.post( "externalpage.php", data);
//make external request two
$.post( "ownserverpage.php", data);
});
I have two forms. I want to submit both forms with 1 button. Is there any method that can help me do it?
Example:
<form method="post" action="">
<input type="text" name="something">
</form>
<form method="post" action="">
<input type="text" name="something">
<input type="submit" value="submit" name="submit">
</form>
I want both forms to be submitted with 1 submit button. Any help would be appreciated.
The problem here is that when you submit a form, the current page is stopped. Any activity on the page is stopped. So, as soon as you click "submit" for a form or use JavaScript to submit the form, the page is history. You cannot continue to submit another page.
A simplistic solution is to keep the current page active by having the form's submission load in a new window or tab. When that happens, the current page remains active. So, you can easily have two forms, each opening in a window. This is done with the target attribute. Use something unique for each one:
<form action='' method='post' target='_blank1'>
The target is the window or tab to use. There shouldn't be one named "_blank1", so it will open in a new window. Now, you can use JavaScript to submit both forms. To do so, you need to give each a unique ID:
<form id='myform1' action='' method='post' target='_blank1'>
That is one form. The other needs another ID. You can make a submit button of type button (not submit) that fires off JavaScript on click:
<submit type='button' onclick="document.getElementById('myform1').submit();document.getElementById('myform2').submit();" value='Click to Submit Both Forms'>
When you click the button, JavaScript submits both forms. The results open in new windows. A bit annoying, but it does what you specifically asked for. I wouldn't do that at all. There are two better solutions.
The easiest is to make one form, not two:
<form action='' method='post'>
<input type='text' name='text1'>
<input type='text' name='text2'>
<input type='submit' value='Submit'>
</form>
You can place a lot of HTML between the form tags, so the input boxes don't need to be close together on the page.
The second, harder, solution is to use Ajax. The example is certainly more complicated than you are prepared to handle. So, I suggest simply using one form instead of two.
Note: After I submitted this, Nicholas D submitted an Ajax solution. If you simply cannot use one form, use his Ajax solution.
You have to do something like that :
button :
<div id="button1">
<button>My click text</button>
</div>
js
<script>
$('#button1').click(function(){
form1 = $('#idIFirstForm');
form2 = $('#idISecondForm');
$.ajax({
type: "POST",
url: form1.attr('action'),
data: form1.serialize(),
success: function( response ) {
console.log( response );
}
});
$.ajax({
type: "POST",
url: form2.attr('action'),
data: form2.serialize(),
success: function( response2 ) {
console.log( response2 );
}
});
});
</script>
You could create a pseudo form in the background. No time to write the code, jsut the theory. After clicking submit just stop propagation of all other events and gather all the informations you need into one other form you append to document (newly created via jquery) then you can submit the third form where all the necesary infos are.
Without getting into why you want to use only 1 button for 2 forms being submitted at the same time, these tools that will get the input data available for use elsewhere:
Option 1...
Instead of using <form> - collect the data with the usual Input syntax.
ex: <input type="text" name="dcity" placeholder="City" />
Instead of using the form as in this example:
<form class="contact" method="post" action="cheque.php" name="pp" id="pp">
<label for="invoice">Your Name</label>
<input type="text" id="invoice" name="invoice" />
<button class="button" type="submit" id="submit">Do It Now</button>
</form>
use:
<label for="invoice">Your Name</label>
<input type="text" id="invoice" name="invoice" />
<button type="button" onclick="CmpProc();" style="border:none;"><img src="yourimage.png"/> Do It Now</button>
Then code the function CmpProc() to handle the processing/submittion.
Inside that function use the Javascript form object with the submit() method as in...
<script type="text/javascript">
function submitform() {
document.xxxyourformname.submit();
}
</script>
Somehow I suspect making the two forms into one for the POST / GET is worth reconsidering.
Option 2...
Instead of POST to use the data to the next page consider using PHP's $_SESSION to store each of your entries for use across your multiple pages. (Remember to use the session_start(); at the start of each page you are storing or retrieving the variables from so the Global aspect is available on the page) Also less work.
Look man. This is not possible with only HTML. weither you gether the inputs in one form or else you use jquery to handle this for you.
Is this possible to add to onclick the comment that is in the textarea in the same form? and how do i get it in javascript function?
<form id='comments' method='post'>
<textarea rows='8' cols='80' name='comments'></textarea> <br />
<input type='submit' name='send' onclick='sendcomment(".$photoid.",".$mynick.",".$_POST['comments'].")' value='Wyślij'>
</form>
<script>
function sendcomment(photoid, mynick,comments){ }
</script>
I'm not really sure what you are trying to do. But I think you are over complicating this. Define your action (a PHP controller to deal with the the request) and the form will be submitted by the browser when the submit button is clicked.
<form id='comments' action='/handler.php' method='post'>
<textarea rows='8' cols='80' name='comments'></textarea> <br />
<input type='submit' name='send' />
</form>
UPDATE:
It sounds to me like what you want to do is submit these by AJAX. I'd highly recommend you use the jQuery library to to this.
Add this to your page <head> tag:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
Then change your form to use a class, rather than id because you can only have one id per name for each page. Since you are using a while loop you need to eliminate this issue.
<form class='comments' action='/handler.php' method='post'>
<textarea rows='8' cols='80' name='comments'></textarea> <br />
<input type='submit' name='send' />
</form>
Now, we need some jQuery to help us out...
$(document).on('submit', '.comments', function(event) {
event.preventDefault();
var serialized = $(this).serialize();
$.ajax({
url: "handler.php",
method: "post",
data: serialized,
})
.done(function(data) {
// take some action when the request completes
});
});
This will prevent the default action of submitting the form when you click the button, then the jQuery will take over and serialize (stringify) the form data and send it to the server as an AJAX request. Once the .done fires you can do more, like show the user a message that the submission was successful... maybe disable the submit button so they can't hammer the server with messages easily, etc... I really hope this helps!
I want to post data from one page to another using javascript post method?
Below is the javascript I am using..
In test1.asp page
<script type="text/javascript">
function Service_Add(Data_ID,Data_Type)
{
var Data_ID=Data_ID;
var Data_Type=Data_Type;
document.miformulario.submit();// Here I want to pass data like "Submit(Data_ID,Data_Type)"
}
</script>
I want to post "Data_ID" and "Data_Type" to test2.asp page
To pass data when you submit a form, you have to include that data in a form input field (hidden, visible, doesn't matter).
You can add hidden fields in your HTML form like this
<input type="hidden" id="Data_ID">
<input type="hidden" id="Data_Type">
and then set the values in your javascript function and then submit (?)
<script type="text/javascript">
function Service_Add(Data_ID,Data_Type)
{
document.getElelementByID("Data_ID").value=Data_ID;
document.getElelementByID("Data_Type").value=Data_Type;
document.miformulario.submit();
}
</script>