I'm trying to get formdata to my php file. but i'm getting not any value on post. please advice me what i'm doing is right? i'm doing something wrong in post
// add item to additem
<script type="text/javascript">
$(document).ready(function(){
$("#additembutton").click(function(evt){
evt.preventDefault();
var formData = new FormData($("form #itemform")[0]);
alert(formData);
$.ajax({
url: 'additem.php',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
enctype: 'multipart/form-data',
processData: false,
success: function (response) {
alert(response);
}
});
return false;
});
</script>
// form submit image
This is my additem.php file
<?php
include '../class/dbconfig.php';
$filename=$_POST['myfile']['name'];
echo $_POST['myfile'];
This is my html form
<form class="form-horizontal" enctype="multipart/form-data">
<div class="form-group">
<label for="select" class="col-md-3 control-label">Menu Type</label>
<div class="col-md-6">
<select class="form-control" id="menutype">
<option>Select Menu</option>
<option value="fastfood">FastFood</option>
<option value="other">Other</option>
</select>
</div>
</div>
<!--
<div class="form-group" id="otherdiv">
<label for="menuorder" class="col-md-3 control-label">Other Menu Type</label>
<div class="col-md-6">
<input type="number" class="form-control" id="othermenu" placeholder="Enter Order">
</div>
</div>
-->
<div class="form-group">
<label for="menuorder" class="col-md-3 control-label">Menu Order</label>
<div class="col-md-6">
<input type="number" class="form-control" id="menuorder" pattern="[0-9]+" placeholder="Enter Order">
</div>
</div>
<div class="form-group">
<label for="select" class="col-md-3 control-label">Menu Status</label>
<div class="col-md-6">
<select class="form-control" id="menustatus">
<option value="1">Active</option>
<option value="0">Deactive</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-3">
<button type="reset" class="btn btn-default">Cancel</button>
<button type="button" class="btn btn-primary" id="addmenubutton" >Submit</button>
</div>
</div>
</form>
You just need to send the form via post:
<form method="POST">
Related
I'm trying to pass data to PHP file using Ajax and then save to MySQL database. From some reasons it's not working. I tested PHP code with passing data from HTML form and it's working. When use Ajax, after click on submit button nothings happen. I think that the problem is in Ajax data parameter.
Here is the code:
HTML
<body>
<div class="container">
<form class="search" action="" method="">
<div class="form-group">
<div class="input-group input-group-lg">
<span class="input-group-addon"><i class="fa fa-search" aria-hidden="true"></i></span>
<input type="text" class="form-control form-control-lg" id="trazi" name="trazi" placeholder="Pretražite artikle - upišite naziv, barkod ili šifru artikla">
</div>
</div>
</form>
<form class="articles" id="novi_artikl" action="" method="">
<div class="form-group row">
<label for="sifra" class="col-sm-4 col-form-label col-form-label-lg">Šifra artikla</label>
<div class="col-sm-8">
<input type="text" class="form-control form-control-lg" id="sifra" name="sifra" placeholder="Upišite šifru">
</div>
</div>
<div class="form-group row">
<label for="barkod" class="col-sm-4 col-form-label col-form-label-lg">Barkod artikla</label>
<div class="col-sm-8">
<input type="text" class="form-control form-control-lg" id="barkod" name="barkod" placeholder="Upišite barkod">
</div>
</div>
<div class="form-group row">
<label for="naziv" class="col-sm-4 col-form-label col-form-label-lg">Naziv artikla</label>
<div class="col-sm-8">
<input type="text" class="form-control form-control-lg" id="naziv" name="naziv" placeholder="Upišite naziv artikla" required>
</div>
</div>
<div class="form-group row">
<label for="mjera" class="col-sm-4 col-form-label col-form-label-lg">Jedinična mjera</label>
<div class="col-sm-8">
<input type="text" class="form-control form-control-lg" id="mjera" name="mjera" placeholder="Upišite mjeru" required>
</div>
</div>
<div class="form-group row">
<label for="cijena" class="col-sm-4 col-form-label col-form-label-lg">Cijena artikla</label>
<div class="col-sm-8">
<div class="input-group input-group-lg">
<input type="text" class="form-control form-control-lg text-right" id="cijena" name="cijena" placeholder="Upišite cijenu" required>
<span class="input-group-addon">KM</span>
</div>
</div>
</div>
<div class="form-group row">
<label for="kolicina" class="col-sm-4 col-form-label col-form-label-lg">Količina artikla</label>
<div class="col-sm-8">
<input type="text" class="form-control form-control-lg text-right" id="kolicina" name="kolicina" placeholder="Upišite količinu" required>
</div>
</div>
<div class="form-group row">
<label for="ukupno" class="col-sm-4 col-form-label col-form-label-lg">Ukupna vrijednost artikla</label>
<div class="col-sm-8">
<div class="input-group input-group-lg">
<input type="text" class="form-control form-control-lg text-right" id="ukupno" name="ukupno" placeholder="Ukupna vrijednost" required>
<span class="input-group-addon">KM</span>
</div>
</div>
</div>
<br>
<div class="float-right">
<button type="submit" class="btn btn-primary btn-lg" id="spremi" name="spremi">Spremi</button>
<button type="submit" class="btn btn-primary btn-lg" id="ponisti" name="ponisti">Poništi</button>
</div>
</form><!-- Content here -->
</div>
<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
<script src="https://use.fontawesome.com/38d56b17e3.js"></script>
<script src="script.js" type="text/javascript"></script>
JavaScript
$('#spremi').click(function(){
var sifra = $('#sifra').val();
var barkod = $('#barkod').val();
var naziv = $('#naziv').val();
var mjera = $('#mjera').val();
var cijena = $('#cijena').val();
var kolicina = $('#kolicina').val();
var ukupno = $('#ukupno').val();
$.ajax({
type: 'POST',
url: 'insert.php',
contentType: "application/json; charset=utf-8",
dataType:'json',
data: ({sifra: sifra}, {barkod: barkod}, {naziv: naziv}, {mjera: mjera}, {cijena: cijena}, {kolicina: kolicina}, {ukupno: ukupno}),
success: function(response){
alert(response);
}
});
});
PHP code
<?php
include("connection.php");
if ($_POST["sifra"]) {
$sifra = $_POST["sifra"];
$barkod = $_POST["barkod"];
$naziv = $_POST["naziv"];
$mjera = $_POST["mjera"];
$cijena = $_POST["cijena"];
$kolicina = $_POST["kolicina"];
$ukupno = $_POST["ukupno"];
$query = "INSERT INTO lista (sifra, barkod, naziv, mjera, cijena, kolicina, ukupno) VALUES ('$sifra', '$barkod', '$naziv', '$mjera', '$cijena', '$kolicina', '$ukupno')";
$results = mysqli_query($dbc, $query);
if($results){
echo "Artikl je uspješno spremljen.";
}
else {
echo "Artikl nije spremljen. Došlo je do pogreške.";
}
}
mysqli_close($dbc);
?>
You should provide the values to the data property of $.ajax as a single object not as a collection of them:
data: {
sifra: sifra,
barkod: barkod,
naziv: naziv,
mjera: mjera,
cijena: cijena,
kolicina: kolicina,
ukupno: ukupno
},
Also, it's very important that you note your PHP code is wide open to SQL injection attacks. You should change the logic to use prepared statements ASAP.
The cause of your problem is the fact you are using type: 'POST'. To quote the docs :
An associative array of variables passed to the current script via the
HTTP POST method when using application/x-www-form-urlencoded or
multipart/form-data as the HTTP Content-Type in the request.
POST is a more "old fashioned" method, typically you would POST a <form> where the content automatically is serialized, i.e urlencoded, but you try to POST data in a JSON format. What you should do is either consider whether you really need POST. If you change it to GET (or simply remove type: 'POST') and access the passed data by $_GET then it will work (as long as you correct data as well).
If not, change the content type to indicate incoming urlencoded data :
$.ajax({
type: 'POST',
url: 'insert.php',
contentType: "application/x-www-form-urlencoded",
data: {sifra: sifra, barkod: barkod, naziv: naziv, mjera: mjera, cijena: cijena, kolicina: kolicina, ukupno: ukupno},
success: function(response){
alert(response);
}
});
I am pretty sure your code will work now, i.e the $_POST works and any message is properly received as plain text you can alert.
I am using three drop down list and use each drop down list onclick function ajax call. I want when I select from drop down it requires time to load data. So I want to load image while processing data from ajax call.
I have tried this:
<form id="my_form" name="my_form">
<div class="row">
<div class="col-md-6"><h5 class="text-primary">City</h5></div>
<div class="col-md-6">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">#</span>
<!--<input type="text" class="form-control" id="city" placeholder="City" aria-describedby="basic-addon1" name="city" >-->
<select class="form-control" id="tps_city" name="tps_city" placeholder="Please Select City" aria-describedby="basic-addon1" required onChange="fun_city(this.value);">
<option>Select City </option>
<option>Pune</option>
<option>Satara</option>
<option>Sangli</option>
<option>Kolhapur</option>
</select>
</div>
</div>
</div>
<div class="row" >
<div class="col-sm-6"><h5 class="text-primary">Tehshil</h5></div>
<div class="col-sm-6">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">#</span>
<select class="form-control" id="tehsil_name" name="tehsil_name" placeholder="Please Select Tehshil" aria-describedby="basic-addon1" required onChange="fun(this.value);">
<option>Select Authority </option>
<?php
?>
</select>
</div>
</div>
</div>
<div class="row" >
<div class="col-sm-6"><h5 class="text-primary"> Wadi</h5></div>
<div class="col-sm-6">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">#</span>
<select class="form-control" id="wadi" name="wadi" placeholder="Village/Wadi/Wasti" aria-describedby="basic-addon1" required onchange="drawChart(this.value);">
<option value="">Please Select Wadi</option>
</select>
</div>
</div>
</div>
<br/>
<div id="result"></div>
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-3"> <input class="btn btn-primary btn-md" type="submit" value="Save" name="submit" id="submit"></div>
<div class="col-md-6"> <input class="btn btn-primary btn-md" type="reset" value="Refresh" name="Cancel" id="cancel" onClick="window.location.reload(true)"></div>
</div>
</form>
<div id="loading">
<img id="loading-image" src="../data/LoaderIcon.gif" alt="Loading..." />
</div>
My ajax code like this
<script>
function fun_city(val) {
// alert(val);
$.ajax({
type: "POST",
data: 'city_name=' + val,
url: "authority_detail.php",
beforesend: function() {
$('#loading').hide();
},
success: function(msg) {
// alert(msg);
var name1 = JSON.parse(msg);
var autho_name = new Array();
var i = 0;
for (var key in name1) {
if (name1.hasOwnProperty(key)) {
autho_name[i] = name1[key]["tps_authority"];
i++;
}
}
// alert(tehsil_name);
$('#tehsil_name').append("<option>Please select Authority</option>");
for (var j in autho_name) {
$('#tehsil_name').append("<option value=\"" + autho_name[j] + "\">" + autho_name[j] + "</option>");
}
}
beforesend is nested inside success. So it can't be triggered before the ajax call, it will be defined (not even triggered) after the ajax call successes.
Instead of :
$.ajax({
success: function(msg) {
beforesend: function() {...}
}
})
do this :
$.ajax({
beforesend: function() {...},
success: function(msg) {...}
})
Instead of beforesend hide the loading image in complete, as complete is a callback function that gets called in success as well as error.
And show the image as first statement of function fun_city(val) before making ajax call.
I am submitting the data of a form using formData because there are some files in my from. Once when I am submitting the form its just skip success after submitting form successfully.
Its occur once when,i am trying to use Html 5 ajax validation for my form.
But When I am trying to use custom validation its working fine.
Js Code are:-
function propertyDetails() {
$('#submitPropertyDetails').click(function () {
if (window.FormData !== undefined) {
if (isValidPropertyDetails() && getPropertyFormData() != null) {
showLoading();
$.ajax({
url: '/Member/PropertyDetails',
type: "POST",
contentType: false,
processData: false,
data: getPropertyFormData(),
success: function (result) {
setAmentiesDetails(result);
hideLoading($('#propertyDetails')[0]);
},
error: function (jqXhr) {
alert(jqXhr.statusText);
$errors = jqXhr.responseJSON;
hideLoading($('#propertyDetails')[0]);
}
});
}
}
else {
alert("FormData is not supported.");
}
});
};
function getPropertyFormData() {
// Create FormData object
var form = $('#propertyDetails')[0];
var officeTypeDetails = new FormData(form);
return officeTypeDetails;
};
var isValidPropertyDetails = function () {
if ($('#propertyDetails')[0].checkValidity()) {
return true;
}
else
return false;
};
My Html Code is:-
<form method="post" id="propertyDetails">
<div class="col-md-8 slid-spaceDetailsMiddleColumn">
<div class="form-group">
<div class="col-md-12">
<div class="col-md-3">
<label class="textColor">Looking for</label>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" data-val="true" data-val-number="The field PropertySubTypeId must be a number." id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="2">
</div>
<div class="col-md-5">
<label class="textColor">Dental</label>
</div>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="1">
</div>
<div class="col-md-5">
<label class="textColor">Medical</label>
</div>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="3">
</div>
<div class="col-md-5">
<label class="textColor">Genral</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-number="The field RentableSquareFeet must be a number." id="RentableSquareFeet" name="RentableSquareFeet" placeholder="Rentable Square Feet" required="" type="text" value="">
<br>
</div>
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-number="The field UsableSquareFeet must be a number." id="UsableSquareFeet" name="UsableSquareFeet" placeholder="Usable Square Feet" required="" type="text" value="">
<br>
</div>
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-date="The field AvilableDate must be a date." id="AvilableDate" name="AvilableDate" placeholder="Avilable Date" required="" type="text" value="">
<br>
</div>
</div>
<div class="col-lg-10">
<div class="form-group">
<div class="col-md-offset-12">
<button class="btn btn-info" id="submitPropertyDetails" type="submit" value="Submit">
Continue
</button>
</div>
</div>
</div>
</div>
<div class="col-md-4 slid-sideMediaSmallColumn">
<br>
<video width="100%" height="160px" controls="" autoplay="autoplay">
<source src="/UploadVideo/hubToBidVideo.png" type="video/mp4">
</video>
<div class="form-group">
<div class="col-md-12">
<input type="file" id="Video" name="Video" class="form-control">
</div>
</div>
</div>
</form>
I have two forms on a page the "top form" searches for movies and I'm trying to get the data found from the top form and pass it as a value to the bottom form so it can get entered into a database.
I am unable to do this but, I can get the results to be displayed on the page. Here is my code:
TOP FORM DATA
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<?php
$squery="";
if(isset($_GET["squery"]))
{
$squery=$_GET["squery"];
}
?>
<div class="col-xs-8 col-xs-offset-2">
<form action="#" method="GET" class="form-horizontal">
<div class="form-group">
<label for="newMovieName" class="col-sm-3 control-label">Search what movie?</label>
<div class="col-sm-9"> <input type="text" name="squery" class="form-control"><br />
<input type="submit" value="Submit" class="btn btn-success"></div></div>
</form>
<script type="text/javascript" charset="utf-8">
var api_key = '6969696969696969696969696969696';
$(document).ready(function(){
$.ajax({
url: 'http://api.themoviedb.org/3/search/movie?api_key=' + api_key + '&query=<?php echo $squery; ?>',
dataType: 'jsonp',
jsonpCallback: 'testing'
}).error(function() {
console.log('error')
}).done(function(response) {
var i=0;
// for (var i = 0; i < response.results.length; i++) {
$('#search_results').append('<li>' + response.results[i].title + '</li>');
// }
$('#search_results_title').append(response.results[i].title);
$('#search_results_release').append(response.results[i].release_date);
$('#search_results_overview').append(response.results[i].overview);
$('#search_results_poster').append('https://image.tmdb.org/t/p/w185' + response.results[i].poster_path);
$('#search_results_votes').append(response.results[i].vote_count);
});
});
</script>
TOP FORM RESULTS
Here is where the results are displayed from the form above BUT, I would like these results to be displayed as a value in the form below.
<h3>Results</h3>
<p id="error"></p>
<ul id="search_results_title"></ul>
<ul id="search_results_release"></ul>
<ul id="search_results_overview"></ul>
<ul id="search_results_poster"></ul>
<ul id="search_results_votes"></ul>
BOTTOM FORM DATA
Here is the bottom form that SHOULD get submitted to the database with the "Results" that are above as the value.
<form class="form-horizontal" role="form" action="processmovie.php" method="get" enctype="text/plain">
<div class="form-group">
<label for="newMovieName" class="col-sm-3 control-label">Title</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="newMovieName" name="movie_name" placeholder="Movie Title" required value="">
</div>
</div>
<div class="form-group">
<label for="movieYear" class="col-sm-3 control-label">Year</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="movieYear" name="movie_year" placeholder="Year" required>
</div>
</div>
<div class="form-group">
<label for="movieBio" class="col-sm-3 control-label">Storyline</label>
<div class="col-sm-9">
<textarea type="email" class="form-control" id="movieBio" name="movie_bio" rows="4" placeholder="Enter Storyline" required></textarea>
</div>
</div>
<div class="form-group">
<label for="newImage" class="col-sm-3 control-label">Movie Cover URL</label>
<div class="col-sm-9">
<input type="text" id="newImage" class="form-control" name="movie_img" placeholder="Enter URL" required>
</div>
</div>
<div class="form-group">
<label for="movieRating" class="col-sm-3 control-label">Rating</label>
<div class="col-sm-9">
<select id="movieRating" name="movie_rating" class="form-control" required>
<option value="G">G</option>
<option value="PG">PG</option>
<option value="PG-13">PG-13</option>
<option value="R">R</option>
<option value="NR">NR (Not Rated)</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<button type="submit" class="btn btn-success">Add Movie</button>
</div>
</div>
</form>
I tried to use a variaty of code to try and get the value here is an example: <?php echo $_GET['search_results_title'];?>
I've also found examples like this: How to pass the value of a form to another form? but, my forms are on the same page and not different ones.
As I said in my comment, you would just want to change your ajax call to something like this:
$.ajax({
url: 'http://api.themoviedb.org/3/search/movie?api_key=' + api_key + '&query=<?php echo $squery; ?>',
dataType: 'jsonp',
jsonpCallback: 'testing'
}).error(function() {
console.log('error')
}).done(function(response) {
var i=0;
$('#newMovieName').val(response.results[i].title);
$('#movieYear').val(response.results[i].release_date);
$('#movieBio').val(response.results[i].overview);
$('#newImage').val('https://image.tmdb.org/t/p/w185' + response.results[i].poster_path);
});
(I'm not sure about the relationship you have between response.results[i].vote_count and movieRating)
Here is a fiddle sort of showing the result, though I can't exactly replicate your code there because of the ajax calls
I'm using Jquery ajax to post data, but $.ajax is not fired. the click button is fired.
There's a javascript warning in firebug Empty string passed to getElementById().
Here's my code
$('body').on('click','button.btnsubmitads',function(event) {
event.preventDefault();
$.ajax({
type:"post",
url:base_url+"advertising/newads",
dataType:"json",
data:$("#newadsform").serialize(),
contentType: "application/json",
success: function(result) {
if(result.status){
console.log('oke');
} else {
console.log('ga oke');
}
},
error: function() {}
});
return false;
});
here's my form
<form class="newadsform form-horizontal" action="" method="post" id="newadsform">
<div class="control-group">
<label class="control-label">Listing</label>
<div class="controls">
<select name="idlisting" class="span10" id="idlisting">
<?php foreach($listing->result() as $data){
echo "<option value=\"".$data->idlisting."\">".$data->title."</option>";
}?>
</select>
</div>
</div>
<div class="control-group">
<label class="control-label">Title</label>
<div class="controls">
<input type="text" class="span10" name="title" id="title">
</div>
</div>
<div class="control-group">
<input type="hidden" id="inputimageadvs" name="imagename" value="" />
<input type="hidden" id="inputimagelarge" name="imagenamelarge" value="" />
<input type="hidden" id="inputimagethumb" name="imagenamethumb" value="" />
<label class="control-label">Image:</label>
<div class="controls">
<div class="example span10" style="margin:0;">
<div class="alert alert-success">
Please use PNG or JPEG extension only, and File size not more than 1 Mb (1024 Kb)
</div>
<ul id="uploadadv" class="styled"></ul>
</div>
</div>
<div class="clear"></div>
</div>
<div class="form-actions span10" style="margin:0;">
<button class="btnsubmitads btn btn-primary" type="submit" id="btnsubmitads">
<i class="icon-ok"></i> Submit
</button>
<button class="btn" type="reset" id="reset">Reset</button>
</div>
</form>
Looks like you have Ads Block Installed.
Last day I've same problem.
try to change
url:base_url+"advertising/newads
with another word that not contain ads or advertising word