Is that possible to pass a value without using form & hidden field?
I try the ajax but not working. Below is my code
../order/?step=0 code:
<script>
jQuery(document).ready(function($){
var step0 = [];
var item = {
pid: 123,
qty: 1
};
step0.push({0:item});
data = JSON.stringify(step0);
$("a.base-product").click(function() {
$.ajax({
type: 'POST',
url: '../order/?step=1',
data: data,
});
});
});
</script>
<a class= "base-product" href="../order/?step=1">next</a>
After I click the next link, will need to ask the data from ajax to ../order/?step=1
../order/?step=1:
print_r($_POST);
But I get Array();
Or is that able to use the $_SESSION?
<form>
<div>
<label for="title">Post title:</label>
<input type="text" id="title" name="title" value="My excellent blog post">
</div>
<div>
<label for="content">Post content:</label>
<textarea id="content" name="content" cols="60" rows="5">
This is the content of my excellent blog post. I hope you enjoy it!
</textarea>
</div>
<div>
<button type="submit">Update post</button>
</div>
<input type="hidden" id="postId" name="postId" value="34657">
</form>
Related
I am trying to post a modal form to a table using php, jquery .ajax but it never works.. tried debugging using firebug and i don't see any errors. i tested the form by using form action="notes_functions.php" and it worked fine.
Profile.php
<div class="modal-body">
<form class="noteform" id="notesmodal" method="post">
<fieldset>
<label>Title</label>
<input type="text" class="form-control" name="note_title" placeholder="Enter a title for your note">
<label>Note</label>
<textarea rows="4" cols="50" class="form-control" name="note_content" placeholder="note"></textarea>
<label>Note type</label>
<div class="panel-body">
<input type="tagsinput" id="teetete" class="tagsinput" value="" />
</div>
<label for="exampleInputFile">Attach a document</label>
<input type="file" id="exampleInputFile3">
<p class="help-block">PDF, DOCX and image files are supported.</p>
<div class="checkbox">
<label>
<input type="checkbox"> Check me out
<input type="label" name="note_account" value="<?php echo $acctname ?>"/>
</label>
</div>
<input type="hidden" name="note_creator" value="<?php echo $_SESSION['username'];?>"/>
</fieldset>
<button class="btn btn-default" id="submitnote" >ADD</button>
</form>
</div>
this is my js code
$(function(){
$("button#submitnote").click(function(){
$.ajax ({
type:"POST",
url:"notes_functions.php",
data: $('form.noteform').serialize(),
success: function(msg){
$("#thanks").html(msg)
$("form.noteform").modal('hide');
},
error: function(){
alert("failure");
}
});
});
});
notes_functions.php
<?php
include_once 'dbconnect.php';
if (isset($_POST['note_title'])) {
$notetitle = strip_tags($_POST['note_title']);
$noteContent = strip_tags($_POST['note_content']);
$noteAccount = strip_tags($_POST['note_account']);
$noteCreator = strip_tags($_POST['note_creator']);
mysql_query("INSERT INTO account_notes (note_title, note_contents, note_account, note_creator)
VALUES ('$notetitle','$noteContent', '$noteAccount', '$noteCreator') ");
echo "Name = ".$notetitle;
echo $noteCreator;
}
?>
You should really be using .submit() rather than click (for submit-by-enter, etc.) and returning false to block conventional submits. You also need to make sure the code to bind the events runs after the form element is created. The easiest way to do this is to put it in the document ready handler.
jQuery(document).ready(function ($) {
$("#notesmodal").submit(function () {
$.ajax({
type: "POST",
url: "notes_functions.php",
data: $('form.noteform').serialize(),
success: function (msg) {
$("#thanks").html(msg)
$("form.noteform").modal('hide');
},
error: function () {
alert("failure");
}
});
return false;
});
});
And change the ADD button to be:
<input type="submit" name="submit" class="btn btn-default" id="submitnote" value="ADD" />
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I'm beginner for PHP. I have a form on the website and this form getting title and description values specific websites (with preg_match).
I want to add url input this form and when you add url and press submit button its auto get fields. Example
Frontend:
<input name="url">https://testdomain.com/posts/6412</input>
Backend:
$link = 'input values here';
Result:
Form fields (title and description getting) refresh or with ajax.
Create a Form and add the fields inside it..
In action, attribute add the file name where you want to post the form..
Form.php
<form method="POST" action="submit.php">
<input name="url" value="https://testdomain.com/posts/6412">
<input type="submit" name="submit" value="Submit">
</form>
submit.php
<?php
if(isset($_POST['submit'])){
$link = $_POST['url'];
}
?>
With AJAX
Form.php
<form method="POST" id="form" action="submit.php">
<div id="result"></div>
<input name="url" value="https://testdomain.com/posts/6412">
<input type="submit" name="submit" value="Submit">
</form>
<script>
$("#form").submit(function(e) {
e.preventDefault();
$.ajax({
type: "post",
url: $(this).attr("action"),
data: $(this).serialize(),
success: function(response) {
$("#result").html(response);
}
});
});
</script>
submit.php
<?php
$link = $_POST['url'];
echo $link;
?>
for ajax, you must have to add jquery library before ajax code
If you use jQuery, you can use its serialize() method to get all the form inputs.
$("#form").submit(function(e) {
e.preventDefault();
$.ajax({
type: "post",
url: $(this).attr("action"),
data: $(this).serialize(),
success: function(response) {
$("#result").html(response);
}
});
});
Note, however, that serialize() won't include the submit button itself. That's only submitted automatically in normal form submissions. If the server expects something like $_POST['submit'] to be set, you have to add it explicitly, e.g.
data: $(this).serialize() + '&submit=true',
Use this as your form, make sure to include method="post" in the form attribute section.
<form class="contact-form" method="post" action="processes/contactusform">
<div class="form-group">
<label for="name" class="sr-only">Name</label>
<input type="name" class="form-control" id="name" placeholder="Name" name="name" required />
</div>
<div class="form-group">
<label for="email" class="sr-only">Email</label>
<input type="email" class="form-control" id="email" placeholder="Email" name="email" required />
</div>
<div class="form-group">
<label for="message" class="sr-only">Message</label>
<textarea class="form-control" id="message" rows="7" placeholder="Message" name="message" required /></textarea>
</div>
<div class="form-group">
<input type="submit" id="btn-submit" class="btn btn-send-message btn-md" value="Send Message" name="submit">
</div>
</form>
In your php code, you can refer to your inputs using:
$name = $_POST['name']; //you use 'name' because the value attribute in html for that specific input is set to "name"
$email = $_POST['email'];
$message = $_POST['message'];
Your welcome
This question already has answers here:
JavaScript: send multiple submitions
(4 answers)
Closed 8 years ago.
I have one actions that sends info to the journals.php and the second actions sends info to the uploads.php file. How can i do this with one submit button.
If you could show an example that would be awesome :)
<form id="login" action="journal.php?journal=journals&id=<?php echo $opened['id']; ?>" method="post" role="form">
<div class="form-group">
<label for="title">Title</label>
<input class="form-control" type="text" name="title" id="title" value="<?php echo $opened['title']; ?>" placeholder="Title">
</div>
<div class="form-group">
<label for="body">body</label>
<textarea class="form-control" name="body" id="body" rows="14" placeholder="body"><?php echo $opened['body']; ?></textarea>
</div>
<button type="submit" id="loginSubmit" class="btn btn-default">Save</button>
<input type="hidden" name="submitted" value="1">
<?php if(isset($opened['id'])) { ?>
<input type="hidden" name="id" value="<?php echo $opened['id']; ?>">
<?php } ?>
</form>
<form action="uploads.php" enctype="multipart/form-data">
<input type="file" name="file">
</form>
I have now tried to make this script.
<script type="text/javascript">
$(document).ready(function() {
$("#Login").click(function(e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "uploads.php",
datatype: "html",
data: $("#loginSubmit").serialize(),
success: function(data) {
}
});
$("#loginSubmit").submit();
});
});
</script>
You can submit the text form with AJAX, wait for it to come back successfully, and then submit the file form regularly.
OR
You can make a single action file and include journal.php and uploads.php in it.
I am trying to post a modal form to a table using php, jquery .ajax but it never works.. tried debugging using firebug and i don't see any errors. i tested the form by using form action="notes_functions.php" and it worked fine.
Profile.php
<div class="modal-body">
<form class="noteform" id="notesmodal" method="post">
<fieldset>
<label>Title</label>
<input type="text" class="form-control" name="note_title" placeholder="Enter a title for your note">
<label>Note</label>
<textarea rows="4" cols="50" class="form-control" name="note_content" placeholder="note"></textarea>
<label>Note type</label>
<div class="panel-body">
<input type="tagsinput" id="teetete" class="tagsinput" value="" />
</div>
<label for="exampleInputFile">Attach a document</label>
<input type="file" id="exampleInputFile3">
<p class="help-block">PDF, DOCX and image files are supported.</p>
<div class="checkbox">
<label>
<input type="checkbox"> Check me out
<input type="label" name="note_account" value="<?php echo $acctname ?>"/>
</label>
</div>
<input type="hidden" name="note_creator" value="<?php echo $_SESSION['username'];?>"/>
</fieldset>
<button class="btn btn-default" id="submitnote" >ADD</button>
</form>
</div>
this is my js code
$(function(){
$("button#submitnote").click(function(){
$.ajax ({
type:"POST",
url:"notes_functions.php",
data: $('form.noteform').serialize(),
success: function(msg){
$("#thanks").html(msg)
$("form.noteform").modal('hide');
},
error: function(){
alert("failure");
}
});
});
});
notes_functions.php
<?php
include_once 'dbconnect.php';
if (isset($_POST['note_title'])) {
$notetitle = strip_tags($_POST['note_title']);
$noteContent = strip_tags($_POST['note_content']);
$noteAccount = strip_tags($_POST['note_account']);
$noteCreator = strip_tags($_POST['note_creator']);
mysql_query("INSERT INTO account_notes (note_title, note_contents, note_account, note_creator)
VALUES ('$notetitle','$noteContent', '$noteAccount', '$noteCreator') ");
echo "Name = ".$notetitle;
echo $noteCreator;
}
?>
You should really be using .submit() rather than click (for submit-by-enter, etc.) and returning false to block conventional submits. You also need to make sure the code to bind the events runs after the form element is created. The easiest way to do this is to put it in the document ready handler.
jQuery(document).ready(function ($) {
$("#notesmodal").submit(function () {
$.ajax({
type: "POST",
url: "notes_functions.php",
data: $('form.noteform').serialize(),
success: function (msg) {
$("#thanks").html(msg)
$("form.noteform").modal('hide');
},
error: function () {
alert("failure");
}
});
return false;
});
});
And change the ADD button to be:
<input type="submit" name="submit" class="btn btn-default" id="submitnote" value="ADD" />
I have a very simple question but its been bugging me for quite some time .I have a html contact us page in which I have a simple form which already has validation assigned to it.The form code is :
<div class="contact_form">
<form method="post" id="contactForm" name="contactForm" action="">
<fieldset class="contactFieldset">
<ul>
<li>
<label for="contactName" class="leftLabel">*Name:</label>
<input type="text" name="contactName" id="contactName" class="contactInput required" value="" />
</li>
<p></p>
<li>
<label for="email" class="leftLabel">*Email:</label>
<input type="text" id="email" name="email" class="contactInput email required" value="" />
</li>
<span class="simple-success">I'll be in touch soon</span>
<li>
<label for="subject" class="leftLabel">*Subject:</label>
<input type="text" name="subject" id="subject" class="contactInput required" value="" />
</li>
<p></p>
<li>
<label for="message" class="leftLabel">*Message:</label>
<textarea rows="10" cols="40" id="message" name="message" class="contactTextarea required"></textarea>
</li>
<p></p>
<li>
<input type="submit" alt="Submit button" name="submit" class="submit" id="submit">
</li>
</ul>
</fieldset>
</form>
</div>
The code which I am using to try and call the php form using ajax is this
$(document).ready(function() {
//if submit button is clicked
$('#submit').click(function () {
alert("test i am here");
/*get the email value*/
var email = $("input#email").val();
var name = $("input#contactName").val();
var subject = $("input#subject").val();
var message=$("input#message").val();
alert("email"+email);
/* Check if the email is good or bad */
var goodEmail = email.match(/\b(^(\S+#).+((\.com)|(\.net)|(\.edu)|(\.mil)|(\.gov)|(\.org)|(\.info)|(\.sex)|(\.biz)|(\.aero)|(\.coop)|(\.museum)|(\.name)|(\.pro)|(\.arpa)|(\.asia)|(\.cat)|(\.int)|(\.jobs)|(\.tel)|(\.travel)|(\.xxx)|(\..{2,2}))$)\b/gi);
apos=email.indexOf("#");dotpos = email.lastIndexOf(".");lastpos=email.length-1;
var badEmail = (apos<1 || dotpos-apos<2 || lastpos-dotpos<2);
/*If the email is bad ,display the error message*/
if (email=="" || !goodEmail || badEmail) {
$("email").focus();
return false;
}
var dataString = 'email='+ email + '\n Name='+ name+ '\n Subject='+ subject+ '\n message='+ message;
alert (dataString);
$.ajax({
type: "POST",
url: "mai.php",
data: dataString,
//Do not cache the page
cache: false,
success: function(html) {
$('.simple-sucess').fadeIn(100).show();
$('.contact_form').fadeOut(100).hide();
$('.simple_error').fadeOut(100).hide();
}
});
return false;
});
});
The thing is the alert is not even being displayed when I press the submit button..what am I doing wrong here?
The validation code is
<script type="text/javascript">
jQuery(document).ready(function($){
$("#contactForm").validate();
});
First of all, use the submit event, not the submit button click event because the submit button is already wired up to do a normal submit. There may also be a bug, be sure to check your javascript console for errors. Either way...
What you probably really want to do is use the jQuery form plugin which will make your code a lot more simple.
Then your revised code would be as simple as:
$('#contactForm').ajaxForm(function() {
$('.simple-sucess').fadeIn(100).show();
$('.contact_form').fadeOut(100).hide();
$('.simple_error').fadeOut(100).hide()
});
In this case you would lose your email validation, but why reinvent the wheel, there are tons of validators out there that already have the bugs worked out etc.
the first thing is you are using :
<input type="submit" alt="Submit button" name="submit" class="submit" id="submit">
in your form, and in jquery you are using .click() event,
if try to change
<input type="submit" alt="Submit button" name="submit" class="submit" id="submit">
to :
<input type="button" alt="Submit button" name="submit" class="submit" id="submit">
then it will work perfectly with the .click() event
or the second option you have if you don't want to change the input type then use .submit() instead of .click()
OMG, so many code lines. A little suggestion: keep it simple enough to debug. A jsfiddle demo is recommended for better answers.
Here I post my solution for ajax forms, which works in basic browsers without javascript support.
html:
<form method="post" id="contactForm" action="somewhere">
Name: <input type="text" name="contactName" />
<br />
<input type="submit" value="Submit this form" />
</form>
javascript:
jQuery(function($){
$('#contactForm').submit(function(e){
e.preventDefault?e.preventDefault():false;
$.post(this.action,$(this).serialize(),function(text){
//callbacks
console.log(text);
});
return false;
})
});