Form to send the name for the table to create
<script>
$(document).ready(function () {
$('#cdbt').click(function (e) {
e.preventDefault();
$.post("insert.php",
{ input_value : $("#myInput").val()},
function(data) {
$('#response').html(data);
console.log("Success");
});
});
});
</script>
<form action="" id= "cdbt" method="post">
<input type="text" id="myInput" placeholder="Title...">
<input type="submit" name="submit">
</form>
insert.php
$value = $_POST['input_value'];
$sql1 = "CREATE TABLE $value";
Create database Table by user input value in php
You have to attach submit event on form:
$(document).ready(function () {
$('#cdbt').submit(function (e) {
e.preventDefault();
$.post("insert.php",
{ input_value : $("#myInput").val()},
function(data) {
$('#response').html(data);
console.log("Success");
});
});
});
Your code is vulnerable to SQL injection you should escape values like:
$value = mysqli_real_escape_string($con,$_POST['input_value'])
Related
trying to store simple email data from website to mysql database, i've written the code however it is not working and i can't figure it out
<form class="subfield">
<input type="text" id="emailInput" name="email" type='email' placeholder="Enter Your Email here" required>
<input type="submit" id="inputSubmit" value="Subscribe">
<span id="st">Email Subscribed!</span>
</form>
<script type="text/javascript">
$(document).ready(function(){
$('#inputSubmit').click(function(){
var email = $('#emailInput').val();
$.ajax({
url:"form_process.php",
method:"POST",
data:{email:email},
success:function(data){
$("form").trigger("reset");
$('#st').fadeIn().html(data);
setTimeout(function(){
$('#st').fadeOut("Slow");
}, 2000);
}
});
});
});
</script>
<?php
//insert.php
$connect = mysqli_connect("localhost", "root", "", "testing");
if(isset($_POST["email"]))
{
$email = mysqli_real_escape_string($connect, $_POST["email"]);
$sql = "INSERT INTO `emails_list`(`email`) VALUES ('".$email."')";
if(mysqli_query($connect, $sql))
{
echo "email Subscribed";
}
}
?>
when submit button is clicked it redirects to the home page as it should and the url also shows the ?email= part but no data is stored on the database also seems no echo is sent from php
EDIT : i noticed the files are saved as index.php instead of index.html is it necessary to save as index.php
possibly way to to prevent deafult browser action. Then call ajax request on submit.
$(document).ready(function(){
$('#inputSubmit').click(function(e){
e.preventdefault();
var email = $('#emailInput').val();
$.ajax({
url:"form_process.php",
method:"POST",
data:{email:email},
success:function(data){
$("form").trigger("reset");
$('#st').fadeIn().html(data);
setTimeout(function(){
$('#st').fadeOut("Slow");
}, 2000);
}
});
});
});
There are two thing you can do about:
Use a button instead of submit
this:
<input type="submit" id="inputSubmit" value="Subscribe">
to:
<input type="button" id="inputSubmit" value="Subscribe">
use preventDefault Method
$(document).ready(function() {
$("#inputSubmit").click(function(e) {
e.preventDefault();
var email = $("#emailInput").val();
$.ajax({
url: "form_process.php",
method: "POST",
data: { email: email },
success: function(data) {
$("form").trigger("reset");
$("#st")
.fadeIn()
.html(data);
setTimeout(function() {
$("#st").fadeOut("Slow");
}, 2000);
}
});
});
});
$(document).ready(function(){
$('#inputSubmit').click(function(e){
e.preventdefault();
var email = $('#emailInput').val();
$.ajax({
url:"form_process.php",
method:"POST",
data:{email:email},
success:function(data){
$("form").trigger("reset");
$('#st').fadeIn().html(data);
setTimeout(function(){
$('#st').fadeOut("Slow");
}, 2000);
}
});
return false;
});
});
the problem is that i am unable to insert data in my database without reloading
i have tested it without the note_sql.js and my note_sql.php works fine but there seems to be a problem in my js file if some body could point me in the right direction it would be wonderful
Index.php
<form id="noteform" action="note_sql.php" method="POST">
<input type="text" name="note"></input>
<input id="sub" type="submit" value="Save Note" />
</form>
<span id="result_note"><span>
<script type ="text/javascript" src="jquery/note_sql.js"></script>
note_sql.js
$("#sub").click(function(){
var data = $("#noteform: input").serializeArray();
$.post($("#noteform").attr("action"),data,function(info){$("result_note").html(info); });
clearInput();
});
$("#noteform").submit(function(){
return false;
});
function clearInput(){
$("#noteform :input").each(function(){
$(this).val('');
});
}
Use Jquery Ajax the working code is given below :
please add ID to Note Form Element :
<pre>
<script>
$(document).ready(function () {
$("#sub").click(function () {
var name = $("#note").val();
var message = $("#message").val();
$.ajax({
type: "post",
url: "note_sql.php",
data: "name=" + name,
success: function (data) {
alert(data);
}
});
});
});
</script>
</pre>
My form
<div class="replymsg">
<form class="mainform" action="reply.php" method="POST">
<textarea class="replytext" ></textarea>
<button data-value="<?php echo $id; ?>"
class="replybutton">Submit</button>
</form>
</div>
$id comes from a MYSQL database. The following "test" code gives me the id of the reply form using Jquery:
<script>
$(".replybutton").click(function(){
alert($(this).data("value"));
});
</script>
Value of commentid :id is not passed when I use "actual" code for the website as follows (reply:replytext ... sends message is working):
<script>
$(document).ready(function(){
$(".replybutton").click(function(){
var id = $(this).data("value");
var replytext = $(".replytext").val();
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
Any ideas,any help is appreciated?
Most probably you should stop the form to submit if you are using ajax because a buttons default behavior is to submit the form:
<script>
$(document).ready(function(){
$(".replybutton").click(function(e){
e.preventDefault(); //<---------------stops the form submission here
var id = $(this).data("value");
var replytext = $(".replytext").val();
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
or add a type to the button:
<button type='button' data-value="<?php echo $id; ?>" class="replybutton">Submit</button>
//------^^^^^^^^^^^^
another way is to use .submit() event:
<script>
$(document).ready(function(){
$(".mainform").submit(function(e){ //<-----pass the event here
e.preventDefault(); //<---------------still you need this
var id = $(this).find('.replybutton').data("value"); // find the elements
var replytext = $(this).find(".replytext").val(); // and here.
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
and in this case you don't need to have a type to your button, but it's good to have it.
Submitting form with AJAX
In form
<div class="replymsg">
<form class="mainform" action="" method=" ">
<textarea class="replytext" ></textarea>
<input type="text" value="<?php echo $id; ?>" name="comment_id" id="comment_id" style="display: none"> <!-- this contain the ID-->
<input type="submit" class="replybutton" id="replybutton" value="Submit">
</form>
</div>
use AJAX
<script>
$(function(){
$( "#replybutton" ).click(function(event)
{
event.preventDefault();
var comment_id = $("#comment_id").val();
var replytext = $(".replytext").val();
$.ajax(
{
type:"post",
url: "./reply.php",
data:{ id:comment_id, reply:replytext,},
success:function($data)
{
$("#result").html(data);
}
});
});
});
</script>
$(document).ready(function(){
$(".replybutton").click(function(e){
e.preventDefault();
var id = $(this).data("value");
var replytext = $(this).prev().val();
$.post("reply.php",{ commentid: id, reply: replytext
},function(data){
$("#result").html(data);
});
});
});
Thanks for the help,I figured it out,my problem was sending Id and replytext in a comment/reply system when clicking replybutton. Working code above.
I just want to know how i can send a "callback" message for "success" or "error".
I really don't know much about jquery/ajax, but, i tried to do this:
I have a basic form with some informations and i sent the informations for a "test.php" with POST method.
My send (not input) have this id: "#send". And here is my JS in the index.html
$(document).ready(function() {
$("#send").click(function(e) {
e.preventDefault();
$(".message").load('teste.php');
});
});
And, in my PHP (test.php) have this:
<?php
$name = $_POST['name'];
if($name == "Test")
{
echo "Success!";
}
else{
echo "Error :(";
}
?>
When i click in the button, the message is always:
Notice: Undefined index: name in /Applications/XAMPP/xamppfiles/htdocs/sites/port/public/test.php on line 3
Error :(
Help :'(
This is your new JS:
$(document).ready(function()
{
$("#send").click(function(e) {
e.preventDefault();
var form_data = $("#my_form").serialize();
$.post('teste.php', form_data, function(data){
$(".message").empty().append(data);
});
});
});
This is your new HTML:
<form id="my_form">
<input type="text" name="name" value="" />
<input type="button" id="send" value="Send" />
</form>
The problem is you have not passed name data to your PHP Use My Javascript Code.
Problem in understanding please reply
$(document).ready(function() {
$(document).on('click','#send',function(e)
{
var params={};
params.name="Your Name ";
$.post('test.php',params,function(response)
{
e.preventDefault();
alert(response); //Alert Response
$(".message").html(response); //Load Response in message class div span or anywhere
});
});
});
This is somewhat more complicated by you can use it more generally in your project. just add a new callback function for each of the forms that you want to use.
<form method="POST" action="test.php" id="nameForm">
<input name="name">
<input type="submit">
</form>
<script>
// wrap everything in an anonymous function
// as not to pollute the global namespace
(function($){
// document ready
$(function(){
$('#nameForm').on('submit', {callback: nameFormCallback },submitForm);
});
// specific code to your form
var nameFormCallback = function(data) {
alert(data);
};
// general form submit function
var submitForm = function(event) {
event.preventDefault();
event.stopPropagation();
var data = $(event.target).serialize();
// you could validate your form here
// post the form data to your form action
$.ajax({
url : event.target.action,
type: 'POST',
data: data,
success: function(data){
event.data.callback(data);
}
});
};
}(jQuery));
</script>
I have a form that adds device name and device id in mysql database. I have written a jquery script that will check whether the device id is already in the db. If exists it will return false. I have the following code-
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){ //newly added
$('#Submit').click(function() {alert('in');
var checkID = $('#device_id').val(); // assuming this is a input text field
$.post('includes/checkid.php', {'device_id' : checkID}, function(data) {
if(data=='exist') alert("already exists"); return false;
else $('#add_dev').submit();
});
});});
</script>
<form method="post" action="includes/process_add.php" name = "add_dev" id = "add_dev">
<tr><td width="150">Device ID</td><td>:<input type="text" name="device_id" id= "device_id"></td></tr>
<tr><td>Device Name</td><td>:<input type="text" name="device_name"></td></tr>
<tr><td></td><td><br><input type="submit" name="submit" id= "submit" value="Add device"></td></tr>
</form>
and checkid.php is -
<?php
include("connection.php");
$id = $_POST['device_id'];
$sql = mysql_query("SELECT device_id FROM devices WHERE device_id = '$id'");
if (mysql_num_rows($sql) > 0) {
echo "exist";
}else echo 'notexist';
?>
its not working..
Ajax is async, return false outside ajax success callback:
$(document).ready(function () { //newly added
$('#submit').click(function () {
alert('in');
var checkID = $('#device_id').val(); // assuming this is a input text field
$.post('includes/checkid.php', {
'device_id': checkID
}, function (data) {
if (data == 'exist') alert("already exists");
else $('#add_dev').submit();
});
return false;
});
});