Call PHP and dialog with one click
I have a form where I want to show the user my input in a dialog and save in SQL using PHP with one click. The problem is that I can only call one (either dialog or PHP) at a time. Since the dialog requires the taganchor
<a href="#" value="Save" onclick="submit()">Save</a>
<script>
document.forms["myform"].reset();
$(function(){
$("#dialog").dialog({
autoOpen:false,
modal:true,
width:400,
height:300,
buttons:{
"OK": function(){
$(this).dialog("close");
alert("Saved");
},
"Cancel":function(){
$(this).dialog("close");
}
}
});
});
function submit(){
$("#location").html($("#pac-input").val());
$("#type").html($("input:radio[name='sex']:checked").val());
$("#open").html($("#open").val());
$("#close").html($("#close").val());
$("#review").html($("#review").val());
$("#rating").html($("input:radio[name='rating']:checked").val());
$("#dialog").dialog("open");
}
</script>
and PHP needs a submit button to save the values
<input type="submit" name="submit">
<?php
$address= $_POST['address'];
$type = $_POST['sex'];
$open = $_POST['open'];
$close = $_POST['close'];
$review = $_POST['review'];
$rating = $_POST['rating'];
$dbname = "addtoilet";
// Create connection
$conn = mysqli_connect("localhost:3306", "root","",$dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
} else{
echo "Connected successfully";
}
$sql = "INSERT INTO add (address, type, open, close)
VALUES ('$address', '$type', '$open', '$close')";
if (mysqli_query($conn, $sql)) {
echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . mysqli_error($conn);
}
mysqli_close($conn);
}
?>
source to share
Write a send function inside the ok function in the dialog.
<a href="#" value="Save" onclick="submit()">Save</a>
<script>
document.forms["myform"].reset();
$(function(){
$("#dialog").dialog({
autoOpen:false,
modal:true,
width:400,
height:300,
buttons:{
"OK": function(){
$("#your_form_id").submit();// also you can call ajax here if you don't want to reload the page
$(this).dialog("close");
alert("Saved");
},
"Cancel":function(){
$(this).dialog("close");
}
}
});
});
function submit(){
$("#location").html($("#pac-input").val());
$("#type").html($("input:radio[name='sex']:checked").val());
$("#open").html($("#open").val());
$("#close").html($("#close").val());
$("#review").html($("#review").val());
$("#rating").html($("input:radio[name='rating']:checked").val());
$("#dialog").dialog("open");
}
</script>
source to share
You will need to use JQuery ajax. which will send data to php with the same click. You can also use the shorthand POST method.
Save the data you want to post in json format in the say data variable and pass it to the post method.
Submit () function {
var location = $ ("# pac-input"). val ();
var data = "{'location': '" + location + "'}"
var jqxhr = $ .post ("example.php", data, function () {
console.log ("success");
})
.done (function () {
$ ("# Dialogue") dialog ("open").
})
.fail (function () {
console.log ("error");
})
.always (function () {
console.log ("finished"),
});
}
You can open a dialog depending on the success of the post method
source to share