Bfive
Reputation: 43
jquery form inserting with php
please help find the sourse of my codes issue...when I click request the page just refreshes with all the data gone but nothing is inserted into the db... here is the image of the db and the code! what do I need to change to be able to insert the data along with the username of the logged in user? ![the database]https://i.sstatic.net/iz8Cn.jpg
@user1151316 I made the changes and here is the code removing the pointless comments...the data is not being inserted and after submitting I get a blank screen...
<?php
//require_once 'includes/dbconnect.php';
session_start();
if (isset($_POST["request"]))
{
//print_r($_POST);die;
//take care of injections
$service = mysqli_real_escape_string($link,$_POST['service']);
$service_details = mysqli_real_escape_string($link,$_POST['service_details']);
$duedate = mysqli_real_escape_string($link,$_POST['duedate']);
$postdate = mysqli_real_escape_string($link,$_POST['postdate']); //READ ONLY DATE POST
// Insert data into mysql + LOGGED IN USERS USERNAME TO BE INSERTED
$sql = "INSERT INTO serviceposts VALUES ('".$_SESSION["username"]."','".$service."', '".$service_details."', '".$duedate."', '".$postdate."')";
$result= $link -> query($sql) or die (mysqli_error($link));
echo "($result)";
// if successfully insert data into database, displays message "Successful".
if($result){
echo "request post success!";
echo'<script>window.location="http://localhost/Project2/User.php#viewrequests";</script>';
}
else {
echo "Possible data input error";
}
$link->close();
}
?>
<!DOCTYPE html>
<html>
<head>
<script src="includes/js/modernizr.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="jqueryAssets/jquery.mobile.icons.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/Mobi~Style~Me.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.icons-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.structure-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.datepicker.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
body,td,th {
font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
color: #303;
}
body {
background-image: url();
}
</style>
<link href="jqueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
a {
font-weight: bolder;
}
</style>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="jqueryAssets/jquery-ui.min.js"></script>
<script src="jqueryAssets/jquery-2.1.1.min.js"></script>
<script src="jqueryAssets/jquery.mobile-1.4.5.min.js"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.dialog.custom.min.js"></script>
<script src="jqueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.datepicker.custom.min.js" type="text/javascript"></script>
<title>MyITjobs</title>
<meta charset="utf-8">
</head>
<body>
<div data-role="page" id="servicerequest" data-theme="c">
<div data-role="header" data-add-back-btn="true"><h4>IT~Service Request</h4></div>
<span align="center"><?php if (isset($_SESSION["username"]))
{
echo "".$_SESSION["username"]."";
}
?>
</span>
<div data-role="content" class="ui-field-contain" align="center" data-content-theme="c">
<form style="align-items:justify" method="post" action="" id="servicerequest">
<input type="hidden" name="service" id="selected_service"/>
<span>
<select name="selectmenu" required class="ui-bar-c slidedown" id="service" data-collapsed="false" onchange="onchangeservice()">
<option selected="selected" class="ui-selectmenu-placeholder">IT-Services</option>
<option value="service1" id="MobileApps">Mobile Apps Development</option>
<option value="service2" id="WebDev">Website Development</option>
<option value="service3" id="Programming">Programming</option>
</select>
</span>
<br>
<span>
<div data-role="fieldcontain">
<label for="service_details">IT~Service Request Details</label>
<textarea name="service_details" cols="35" rows="6" id="service_details" placeholder="Input Request details"></textarea>
</div>
</span>
<span>
<label for="duedate">Set Due Date:</label>
<input type="datetime-local" required name="duedate" id="duedate" data-mini="true">
</span>
<br>
<span>
<label for="datetime-local">Request Date</label>
<DateTime id="postdate" data-mini="true">
<?php
$postdate = date("Y-m-d, H:i");
echo "$postdate";
?>
</span>
<input type="hidden" name="postdate" value="<?php echo $postdate; ?>"/>
<br>
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<button type="submit" data-icon="check" data-iconshadow="true" data-iconpos="left" id="request" name="request">Request</button></div>
<div class="ui-block-b">
<button type="reset" data-icon="delete" data-iconshadow="true" data-iconpos="left">Cancel</button>
</div>
</fieldset>
<script>
function onchangeservice()
{
var service_option = $( "#service option:selected" ).text();
$('#selected_service').val(service_option);
}
</script>
</form>
</div>
<div data-role="footer" data-theme="c" align="center">
</div>
</div>
</body>
</html>
Upvotes: 1
Views: 94
Answers (2)
AnkiiG
Reputation: 3488
Do below steps to resolve the issue :
Add a new hidden field
<input type="hidden" name="service" id="selected_service"/>Add onchange function to select box as
<select name="selectmenu" required class="ui-bar-c slidedown" id="service" data-collapsed="false" onchange="onchangeservice()">Replace your script into function
function onchangeservice() { var service_option = $( "#service option:selected" ).text(); $('#selected_service').val(service_option); }
Full code will look like :
`<?php
require_once 'includes/dbconnect.php';
session_start();
//require_once 'includes/dbconnect.php';
/* if (isset($_SESSION["username"]) && !empty($_SESSION["username"])){
echo "".strtoupper($_SESSION['username'])."(Sign out)"; }else{
echo "Sign In";
} */
if (isset($_POST["request"]))
{
//print_r($_POST);die;
//take care of injections
$service = mysqli_real_escape_string($link,$_POST['service']);
$service_details = mysqli_real_escape_string($link,$_POST['service_details']);
$duedate = mysqli_real_escape_string($link,$_POST['duedate']);
$postdate = mysqli_real_escape_string($link,$_POST['postdate']); //READ ONLY DATE POST
// Insert data into mysql + LOGGED IN USERS USERNAME TO BE INSERTED
$sql = "INSERT INTO serviceposts VALUES ('".$_SESSION["username"]."','".$service."', '".$service_details."', '".$duedate."', '".$postdate."')";
$result= $link -> query($sql) or die (mysqli_error($link));
echo "($result)";
// if successfully insert data into database, displays message "Successful".
if($result){
echo "request post success!";
echo'<script>window.location="http://localhost/Project2/User.php#viewrequests";</script>';
// header('Location: ../User.php?success=1');
}
else {
echo "Possible data input error";
//header('Location: ../user.php?error=1');
}
$link->close();
}
?>
<!DOCTYPE html>
<html>
<head>
<script src="includes/js/modernizr.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="jqueryAssets/jquery.mobile.icons.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/Mobi~Style~Me.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.icons-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.structure-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.datepicker.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
body,td,th {
font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
color: #303;
}
body {
background-image: url();
}
</style>
<link href="jqueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
a {
font-weight: bolder;
}
</style>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="jqueryAssets/jquery-ui.min.js"></script>
<script src="jqueryAssets/jquery-2.1.1.min.js"></script>
<script src="jqueryAssets/jquery.mobile-1.4.5.min.js"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.dialog.custom.min.js"></script>
<script src="jqueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.datepicker.custom.min.js" type="text/javascript"></script>
<title>MyITjobs</title>
<meta charset="utf-8">
</head>
<body>
<div data-role="page" id="servicerequest" data-theme="c">
<div data-role="header" data-add-back-btn="true"><h4>IT~Service Request</h4></div>
<span align="center"><?php if (isset($_SESSION["username"]))
{
echo "".$_SESSION["username"]."";
}
?>
</span>
<div data-role="content" class="ui-field-contain" align="center" data-content-theme="c">
<form style="align-items:justify" method="post" action="" id="servicerequest">
<input type="hidden" name="service" id="selected_service"/>
<span>
<select name="selectmenu" required class="ui-bar-c slidedown" id="service" data-collapsed="false" onchange="onchangeservice()">
<option selected="selected" class="ui-selectmenu-placeholder">IT-Services</option>
<option value="service1" id="MobileApps">Mobile Apps Development</option>
<option value="service2" id="WebDev">Website Development</option>
<option value="service3" id="Programming">Programming</option>
</select>
</span>
<br>
<span>
<div data-role="fieldcontain">
<label for="service_details">IT~Service Request Details</label>
<textarea name="service_details" cols="35" rows="6" id="service_details" placeholder="Input Request details"></textarea>
</div>
</span>
<span>
<label for="duedate">Set Due Date:</label>
<input type="datetime-local" required name="duedate" id="duedate" data-mini="true">
</span>
<br>
<span>
<label for="datetime-local">Request Date</label>
<DateTime id="postdate" data-mini="true">
<?php
$postdate = date("Y-m-d, H:i");
echo "$postdate";
?>
</span>
<input type="hidden" name="postdate" value="<?php echo $postdate; ?>"/>
<br>
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<button type="submit" data-icon="check" data-iconshadow="true" data-iconpos="left" id="request" name="request">Request</button></div>
<div class="ui-block-b">
<button type="reset" data-icon="delete" data-iconshadow="true" data-iconpos="left">Cancel</button>
</div>
</fieldset>
<script>
function onchangeservice()
{
var service_option = $( "#service option:selected" ).text();
$('#selected_service').val(service_option);
}
</script>
</form>
</div>
<div data-role="footer" data-theme="c" align="center">
</div>
</div>
</body>
</html>`
Upvotes: 1
AnkiiG
Reputation: 3488
You have to do lots of fixes.
- You have not added any name attribute to all the input types so they were not posting.
- You should write code much indented and clean so that you can find out the issues.
- Don't include files multiple times.
- Remove unwanted commented code.
Please try below code :
<?php
require_once 'includes/dbconnect.php';
session_start();
//require_once 'includes/dbconnect.php';
/* if (isset($_SESSION["username"]) && !empty($_SESSION["username"])){
echo "".strtoupper($_SESSION['username'])."(Sign out)"; }else{
echo "Sign In";
} */
if (isset($_POST["request"]))
{
//take care of injections
$service = mysqli_real_escape_string($link,$_POST['service']);
$service_details = mysqli_real_escape_string($link,$_POST['service_details']);
$duedate = mysqli_real_escape_string($link,$_POST['duedate']);
$postdate = mysqli_real_escape_string($link,$_POST['postdate']); //READ ONLY DATE POST
// Insert data into mysql + LOGGED IN USERS USERNAME TO BE INSERTED
$sql = "INSERT INTO serviceposts VALUES ('".$_SESSION["username"]."','".$service."', '".$service_details."', '".$duedate."', '".$postdate."')";
$result= $link -> query($sql) or die (mysqli_error($link));
echo "($result)";
// if successfully insert data into database, displays message "Successful".
if($result){
echo "request post success!";
echo'<script>window.location="http://localhost/Project2/User.php#viewrequests";</script>';
// header('Location: ../User.php?success=1');
}
else {
echo "Possible data input error";
//header('Location: ../user.php?error=1');
}
$link->close();
}
?>
<!DOCTYPE html>
<html>
<head>
<script src="includes/js/modernizr.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="jqueryAssets/jquery.mobile.icons.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/Mobi~Style~Me.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.icons-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.mobile.structure-1.4.5.min.css" rel="stylesheet" type="text/css">
<link href="jqueryAssets/jquery.ui.datepicker.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
body,td,th {
font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
color: #303;
}
body {
background-image: url();
}
</style>
<link href="jqueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<style type="text/css">
a {
font-weight: bolder;
}
</style>
<script src="jqueryAssets/jquery-1.11.1.min.js"></script>
<script src="jqueryAssets/jquery-ui.min.js"></script>
<script src="jqueryAssets/jquery-2.1.1.min.js"></script>
<script src="jqueryAssets/jquery.mobile-1.4.5.min.js"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.dialog.custom.min.js"></script>
<script src="jqueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jqueryAssets/jquery-ui-1.9.2.datepicker.custom.min.js" type="text/javascript"></script>
<title>MyITjobs</title>
<meta charset="utf-8">
</head>
<body>
<div data-role="page" id="servicerequest" data-theme="c">
<div data-role="header" data-add-back-btn="true"><h4>IT~Service Request</h4></div>
<span align="center"><?php if (isset($_SESSION["username"]))
{
echo "".$_SESSION["username"]."";
}
?>
</span>
<div data-role="content" class="ui-field-contain" align="center" data-content-theme="c">
<form style="align-items:justify" method="post" action="" id="servicerequest">
<span>
<select name="selectmenu" required class="ui-bar-c slidedown" id="service" data-collapsed="false">
<option selected="selected" class="ui-selectmenu-placeholder">IT-Services</option>
<option value="service1" id="MobileApps">Mobile Apps Development</option>
<option value="service2" id="WebDev">Website Development</option>
<option value="service3" id="Programming">Programming</option>
</select>
</span>
<br>
<span>
<div data-role="fieldcontain">
<label for="service_details">IT~Service Request Details</label>
<textarea name="service_details" cols="35" rows="6" id="service_details" placeholder="Input Request details"></textarea>
</div>
</span>
<span>
<label for="duedate">Set Due Date:</label>
<input type="datetime-local" required name="duedate" id="duedate" data-mini="true">
</span>
<br>
<span>
<label for="datetime-local">Request Date</label>
<DateTime id="postdate" data-mini="true">
<?php
$postdate = date("Y-m-d, H:i");
echo "$postdate";
?>
</span>
<input type="hidden" name="postdate" value="<?php echo $postdate; ?>"/>
<br>
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<button type="submit" data-icon="check" data-iconshadow="true" data-iconpos="left" id="request" name="request">Request</button></div>
<div class="ui-block-b">
<button type="reset" data-icon="delete" data-iconshadow="true" data-iconpos="left">Cancel</button>
</div>
</fieldset>
<script>
$( "#service option:selected" ).text();
</script>
</form>
</div>
<div data-role="footer" data-theme="c" align="center">
</div>
</div>
</body>
</html>
Upvotes: 0
Related Questions
- jQuery Mobile form post issues, PHP warning: (expects parameter 1 to be mysqli, null given)
- Inserting non-form data into database using jQuery
- PHP and jQuery insert into MySQL
- Inserting a database record from an HTML form with jQuery + AJAX
- Inserting into MySQL from PHP (jQuery/AJAX)
- Unable to insert data into database using PHP and J Query Mobile
- php + mysql insert error
- How to submit a form inside a jQuery Mobile page?
- Forms elements don't insert with the correct jquery mobile design
- Insert into MySQL database with jQuery and PHP