JSON Array not returning object instead returning value
HI friends i have a scenario wherein the user enters his memberid i do a jquery ajax with memberid and fetch the details related to him and put it in a textbox ,
It was working fine on my server when the code is deployed to other server i'm not getting the result
the code is as shown below
createaccount.php
<title>Century Club</title>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link href="css/century-club.css" rel="stylesheet">
<script src="js/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
function check()
{
var mid = $("#memberid").val();
var dataString = "mid=" + mid ;
$.ajax({
type: "POST",
url: "getdetails2.php",
datatype: 'json',
data: dataString,
beforeSend: function()
{
$('#process').html($('#status').html());
},
success: function(data)
{
$('#process').html('');
alert(data);
$.each(data, function (i,member) {
$("#name").val(member.name);
});
}
});
}//End of SecureLogin
</script>
</head>
<body>
<div class="container">
<div class="menu">
<span class="nav_top"></span>
<div class="clr"></div>
<nav id="menu-wrap">
</nav>
</div>
</div>
<div class="container">
<div class="register">
<div class="row">
<div class="col-xs-12 col-md-9">
<div class="matter"><div style="clear:both; height:15px;"></div>
<center><h1>Create New Account</h1></center>
<div style="clear:both; height:8px;"></div>
<div class="join-club">
<h4 class="join-heading">Century Club - Create Account <br><span class="legend"><font color="#FF0000"><font class="red"> *</font></font> indicates a mandatory field</span></h4>
<div align="center" id="status" style="display:none">
Just Wait a Moment..</div>
<div id="process" class="process"></div>
<form id="register" name="register" method="POST">
<table class="join-members" width="100%" style="margin:10px 0 0 0; ">
<tbody>
<tr>
<td width="47%"><span>User Name (Membership Account No.)<font class="red"> *</font></span>
<p>(Example : abcd1234)</p>
</td>
<td colspan="2">
<input type="text" name="memberid" id="memberid" Maxlength="15"
value="<?php if(!empty($memberid)) echo $memberid;?>" autocomplete="off" style="width: 95%;
padding: 6px;" class="email2" onblur="check();" /></td>
</tr>
<tr>
<td><span>Name <font class="red"> *</font></span></td>
<td colspan="2"><input type="text" name="name" id="name" readonly
value="<?php if(!empty($name)) echo $name;?>" class="email"/></td>
</tr>
<tr>
<td >
</td>
<td colspan="2"> <input type="submit" name='submit_req' value="Submit" class="button" style="margin:0" /> </td>
</tr>
</tbody>
</table>
</form>
</div>
</div>
</div>
</div>
<div class="clr"></div>
</div>
</div>
</div>
</body>
</html>
JSon response file getdetails2.php
<?php
include("connection.php");
$mid=trim($_POST['mid']);
$query="Select member_id,member_name,office_number,mobile_number,Residence_number from cm_details where member_id='$mid'";
$data=mysqli_query($dbc,$query);
//while loop starts here buddy
while($row=mysqli_fetch_array($data))
{
$mid=$row[0];
$mname=$row[1];
$rows[] = array("name" => $mname);
}//end of while loop here
#header("Content-type: application/json");
echo json_encode($rows);
?>
As far as the analysis made it is treating the JSON response as an object in my server where the code works fine but in the other server it doesnt treate it as an object
And one more error i noticed is
Uncaught TypeError: Cannot use 'in' operator to search for '182' in
[{"name":"SRI.M.S.ASHOKKUMAR","mobile":"9845901242","rescode":"080","resnum":"25253602","rescode1":"","resnum1":"","offcode":"","offnum":"","offcode1":"","offnum1":"","mobile1":""}]
Thats all i could do guys i feel like JSON is not identified by the server something like that help me guys expecting your answers as soon as possible
What kind of error / problems are you seeing if any? Also maybe use header instead of #header so that you can see error messages.
have you checked your php version on the server that isnt working?
json_encode / json_decode were introduced in php 5.2.
If that's the problem you might need to use something like jsonwrapper.
Related
I just recently starting to learn about programing. Right now im working on my little project for learning jquery. But i found some difficulty in those. The validity plugin and fancy box wont appear at all. Here is my code :
Fancybox :
<script type="text/javascript" src="../plugin/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="../plugin/fancybox/jquery.fancybox-1.3.4.css" />
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
<?php
if(!defined("INDEX")) die("---");
?>
<h2>Galeri Foto</h2>
<div class="galeri">
<table cellpadding="5">
<tr>
<?php
$no=1;
$artikel = mysqli_query($koneksi, "select * from `Tabel Galeri` order by id_galeri desc limit 12");
while($data=mysqli_fetch_array($artikel)){
?>
<td align="center">
<a class="fancybox" href="../gambar/galeri/<?=$data['gambar'];?>" title="<?=$data['judul'];?>">
<img src="../gambar/galeri/<?=$data['gambar'];?>" width="150" height="100">
<br><?=$data['judul'];?>
</a>
</td>
<?php
if($no%4 == 0) echo"</tr><tr>";
$no++;
}
?>
</tr>
</table>
</div>
Validity
<script src="../plugin/validity/build/jquery.validity.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="../plugin/validity/build/jquery.validity.css" >
<script type="text/javascript">
$(document).ready(function() {
$("#formkontak").validate(function(){
$("#nama").require('Nama tidak boleh kosong!');
$("#email").require('Email tidak boleh kosong!').match('email', 'Email tidak valid!');
$("#pesan").require('Pesan tidak boleh kosong!');
});
});
</script>
<?php
if(!defined("INDEX")) die("---");
?>
<h2>Kontak</h2>
<form method="post" action="?tampil=kontak_proses" id="formkontak">
<table>
<tr>
<td>Nama</td>
<td><input type="text" name="nama" id="nama"></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" id="email" name="email"></td>
</tr>
<tr>
<td valign="top">Pesan</td>
<td><textarea name="pesan" id="pesan" cols="50" rows="10"></textarea></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Kirim Pesan"></td>
</tr>
</table>
</form>
Index file:
<?php
session_start();
include("../lib/koneksi.php");
define("INDEX", true);
?>
<html>
<head>
<title> Halaman Pengunjung </title>
<link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
});
</script>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="menu">
<?php include("menu.php");?>
</div>
<div id="content">
<div id="kiri">
<?php include("konten.php");?>
</div>
<div id="kanan">
<?php include("sidebar.php");?>
</div>
</div>
<div id="footer">
<p>Copyright © HASBY FAHRUDIN</p>
</div>
</div>
</body>
</html>
I try to trace my code one by one (based on book that i read) and looked for solution in stackoverflow but i cant make it works. Sorry for asking a basic question and i hope someone can help me. Cheers!
I want to save multiple data in one go using codeigniter and then on success load the data on my datatable wihtout refreshing the whole page. I am able to do this successfully if I use modal and insert a single value but when I try to save multiple values, it doesn't work. I produce my input boxes on button click. Below are my codes:
CONTROLLER
public function add_multiple_orders(){
$dataset=[];
$item_name=$this->input->post('m_item_name');
$quantity=$this->input->post('m_quantity');
$amount=$this->input->post('m_amount');
$order_comment=$this->input->post('m_order_comment');
$branch_name=$this->input->post('m_branch_name');
$date_added=$this->input->post('m_date_added');
for($i=0;$i<sizeof($item_name);$i++){
$dataset[$i]=array(
'date_added'=>$date_added,
'item_name'=>$item_name[$i],
'quantity'=>$quantity[$i],
'amount'=>$amount[$i],
'ordered_by'=>$this->session->userdata['username'],
'order_status'=>'ordered',
'order_comment'=>$order_comment[$i],
'branch_name'=>$branch_name
);
}
$result=$this->sales_model->insert_mult_orders($dataset);
}
VIEW
<a name="mult_page">
<button class="btn btn-info" data-toggle="collapse" data-target="#add_multiple" style="margin-left: 20px;">Add Multiple Orders</button>
<div class="collapse" id="add_multiple" style="width: 95%; margin: 0 auto; margin-top: 10px;">
<div class="row">
<div class="col-md-12">
<div class="panel panel-primary">
<div class="panel-heading">
</div>
<div class="panel-body">
<form class="form_mult_ordrs form-inline" method="post">
<div class="form-group">
<label for="m_date_added">Date</label>
<input type="date" name="m_date_added" required>
</div>
<div class="form-group">
<label for="m_branch_name" class="control-label">Branch Name</label>
<select name="m_branch_name" class="form-control">
<option value="superdome">Superdome</option>';
<option value="seaside">Sea Side</option>
<option value="robinsons">Robinsons</option>
</select>
</div>
<div class="btn btn-warning pull-right" onclick="add_new_row()">Add more</div>
<hr>
<div style="font-weight: bold;">Total Php <input type="text" id="total_result" placeholder="0.00" class="form-control"></div>
<br>
<table id="mult_ord_tbl" class="table table-striped table-bordered table-condensed">
<thead>
<tr>
<th class="ui-help-center">Item Name</th>
<th class="ui-help-center">Quantity</th>
<th class="ui-help-center">Amount</th>
<th class="ui-help-center">Comment</th>
<th class="ui-help-center">Delete</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<select name="item_name[]" class="form-control">
<?php foreach($items as $item){
echo '<option value"='.$item->item_name.'">'.$item->item_name.'</option>';
} ?>
</select>
</td>
<td><input type="text" name="m_quantity[]" placeholder="Quantity"></td>
<td><input type="text" name="m_amount[]" id='m_amount[]' placeholder="Amount" onblur="total_values()"></td>
<td><input type="text" name="m_order_comment[]" placeholder="Commment"></td>
<td>
<button class="btn btn-danger" onclick="delete_row(this)"><i class="glyphicon glyphicon-remove"></i></button>
</td>
</tr>
</tbody>
</table>
<tr>
<td colspan="12">
<button id="btn_mult_ordrs" class="btn btn-success" onclick="save_mult_ordrs()" value="">Submit All</button>
</td>
</tr>
</form>
</div> <!-- end of panel body -->
<div class="panel-footer">
footer
</div>
</div> <!-- end of panel primary -->
</div> <!-- end of column 12 -->
</div> <!-- end of row -->
</div> <!-- end of collapse -->
<script type="text/javascript">
$(document).ready(function(){
$('#table_id').DataTable({
"order":[[0,"desc"]]
});
});
function save_mult_ordrs(){
if(confirm("Are you done?")){
var url="<?php echo site_url('sales/add_multiple_orders')?>";
add_new_row();
// $("#form_mult_ordrs").submit();
$.ajax({
url:url,
type:"POST",
data:$('#form_mult_ordrs').serialize(),
datatype:"JSON",
success:function(data)
{
alert('All data has been saved.');
location.reload();
},
error:function(jqXHR, textStatus, errorThrown){
alert('Error in saving.');
}
});
}
}
function add_new_row(){
var arrTables = document.getElementById('mult_ord_tbl');
var oRows = arrTables.rows;
var numRows = oRows.length;
var newRow = document.getElementById('mult_ord_tbl').insertRow( numRows );
var cell1=newRow.insertCell(0);
var cell2=newRow.insertCell(1);
var cell3=newRow.insertCell(2);
var cell4=newRow.insertCell(3);
var cell5=newRow.insertCell(4);
cell1.innerHTML = "<tr><td><select name='m_item_name[]' class='form-control'>" +
<?php
foreach($items as $item){
echo ('"<option value=\"'.$item->item_name.'\">'.$item->item_name.'</option>"+');
}
?>
+ "</select></td>";
cell2.innerHTML="<td height='5'><input type='text' name='m_quantity[]' placeholder='Quantity'></td>";
cell3.innerHTML="<td height='5'><input type='text' name='m_amount[]' placeholder='Amount' onblur='total_values()'></td>"
cell4.innerHTML="<td height='5'><input type='text' name='m_order_comment[]' placeholder='Comment'></td>";
cell5.innerHTML="<td><button class='btn btn-danger' onclick='delete_row(this)''><i class='glyphicon glyphicon-remove'></i></button></td></tr>";
}
</script>
MODEL
public function insert_mult_orders($data){
$this->db->insert_batch('piercapitan.sls_ordrs',$data);
return $this->db->affected_rows();
}
Your help is immensely appreciated.
Never mind guys. I found what's wrong. It's my form id! I somehow placed the name on the class and not on the id.
<form class="form_mult_ordrs form-inline" method="post">
It should have been:
<form id="form_mult_ordrs" class="form-inline" method="post">
I have a PHP page which contains 2 tabs Entry and View. From the Entry tab I can insert data in a database and on my View tab I have an HTML table which displays the data. There is also a provision to insert data from my View tab as well.
I want to reload my table every time some new data is added. I tried this using jQuery but the problem is that it reloads my entire page and sends me back to my Entry tab, even if I have inserted the data from my View tab. Can anyone tell me if there is any provision to reload just HTML table every time I add new data to the database and stay on the same tab from wherever I have added my data?
Here is what I have tried:
$(document).ready(function(e) {
var refresher = setInterval("update_content();", 60000);
})
function update_content(){
$.ajax({
type: "GET",
url: "main.php",
cache: false,
}).done(function( page_html ) {
// alert("LOADED");
var newDoc = document.open("text/html", "replace");
newDoc.write(page_html);
newDoc.close();
});
}
main.php code goes here-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Logsheet-Dhanraj & Co.</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
<link href="css/table_edit.css" rel="stylesheet">
<link href="css/styleinputcontainer.css" rel="stylesheet">
<link href="css/footable.standalone.css" rel="stylesheet">
<link href="css/footable.core.css" rel="stylesheet">
<link rel="stylesheet" href="jquery-ui\jquery-ui-themes-1.11.4\jquery-ui-themes-1.11.4\themes/smoothness/jquery-ui.css" />
</head>
<body>
<header>
<div class="container-fluid">
<div class="panel panel-info">
<div class="panel-heading">
<div class="panel-title ">Logsheet-Dhanraj
<button type="button" class="close" data-dismiss="panel">×</button></div>
</div><!--panel heading-->
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active">Entry</li>
<li >View</li>
</ul>
<div class="tab-content">
<div class="tab-pane fade in active" id="Entry">
<div class="container-fluid">
<form id="dataentry" action="insert_data.php" method="post">
<div class="row">
<br />
<br />
</div><!--empty row-->
<div class="row">
<div class="form-group col-md-2">
<label for="Date">Date</label></br>
<input type="text" name="date" id="date" autocomplete="off"/>
</div><!--col 1-->
<div class="form-group col-md-3">
<div class="input_container">
<label for="Clientname">Client Name</label></br>
<input type="text" name="clientname" id="clientname" onkeyup="autocomplete_client()" autocomplete="off" />
<ul id="clientlist_id"></ul>
</div><!--inputcontainer client-->
</div><!--col 2-->
<div class="form-group col-md-4">
<div class="input_container">
<label for="Staff">Staff</label></br>
<input type="text" name="staff" id="staff" onkeyup="autocomplete_staff()" autocomplete="off"/>
<ul id="stafflist_id"></ul>
</div><!--inputcontainer staff-->
</div><!--col 3-->
</div><!--row1-->
<div class="row">
<div class="form-group col-md-12">
<label for="Matter">Matter</label></br>
<textarea rows="4" cols="60" name="matter" id="matter" ></textarea>
</div><!--matter col-->
</div><!--row2-->
<div class="row">
<div class="col-md-9">
<button id="sub" name="submit" class="btn btn-info">Submit</button>
<button id="cancel" class="btn btn-danger">Cancel</button>
</div><!--button col-->
</div><!--row3-->
</form>
<div class="container-fluid">
<br />
<div class="row">
<br />
<p id="result"></p>
</div>
</div><!--result-container-->
</div><!--entry container-->
</div><!--entry tab-->
<div class="tab-pane fade" id="View">
<div class="container-fluid" id="view_result"><br />
<form id="viewentry" action="view_insert.php" method="post">
<div class="inputWrapper">
<div class="row">
<div class="col-md-3">
<div class="input_container">
<label for="Client Name">Client Name</label><br />
<input type="text" name="viewclientname" id="viewclientname" onkeyup="viewautocomplete_client()" autocomplete="off"/>
<ul id="viewclientlist_id"></ul>
</div>
</div>
<div class="col-md-3">
<div class="input_container">
<label for="Staff Name">Staff Name</label><br />
<input type="text" id="viewstaff" name="viewstaff" onkeyup="viewautocomplete_staff()" autocomplete="off"/>
<ul id="viewstafflist_id"></ul>
</div>
</div>
<div class="col-md-4">
<label for="Matter">Matter</label><br />
<input type="text" id="matter" name="matter" />
</div>
<div class="col-md-1">
<br />
<button id="add" class="btn btn-info">Add New</button>
</div>
<div class="col-md-1">
<br />
<button id="can" class="btn btn-danger">Cancel</button>
</div>
</div>
</div>
</form>
<p id="done"></p>
<div class="row">
<br /><br /><label for="Search">Search:</label>
<input type="text" id="filter" /><br><br>
</div>
<div id="divGrid">
<table class="footable" data-filter="#filter" id="tableresult">
<thead>
<th>Client name</th>
<th>Staff name</th>
<th>Matter</th>
<th> Delete</th>
</thead>
<?php
include('db.php');
$sql=mysql_query("SELECT * FROM newdata ORDER BY client_name ASC");
while($row=mysql_fetch_array($sql))
{
$id=$row['id'];
$clientname=$row['client_name'];
$staff=$row['staff'];
$matter=$row['matter'];
?>
<tr id="<?php echo $id; ?>" class="edit_tr">
<td class="edit_td" >
<span id="client_<?php echo $id; ?>" class="text"><?php echo $clientname; ?></span>
<input type="text" value="<?php echo $clientname; ?>" class="editbox" id="client_input_<?php echo $id; ?>" />
</td>
<td class="edit_td">
<span id="staff_<?php echo $id; ?>" class="text"><?php echo $staff; ?></span>
<input type="text" value="<?php echo $staff; ?>" class="editbox" id="staff_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="matter_<?php echo $id; ?>" class="text"><?php echo $matter; ?></span>
<input type="text" value="<?php echo $matter; ?>" class="editbox" id="matter_input_<?php echo $id; ?>"/>
</td>
<td class="delete_td"><input type="button" id="del" class="btn btn-danger" value="×"></input></td>
</tr>
<?php
}
?>
</tbody>
<tfoot class="hide-if-no-paging">
<th> </th>
<th>
<div class="pagination pagination-centered"></div>
</th>
<th> </th>
<th> </th>
</tfoot>
</table>
</div>
</div>
</div><!--view tab-->
</div><!--tab content-->
</div><!--panel body-->
</div><!--panel info-->
</div><!--container-->
</header>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/footable.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/footable.filter.js"></script>
<script type="text/javascript" src="js/footable.paginate.js"></script>
<script type="text/javascript" src="scripts/autocomplete.js"></script>
<script type="text/javascript" src="scripts/view_autocomplete.js"></script>
<script type="text/javascript" src="scripts/footable.js"></script>
<script type="text/javascript" src="scripts/insert_submit.js"></script>
<script type="text/javascript" src="scripts/view_insert.js"></script>
<!--<script type="text/javascript" src="scripts/selected_row.js"></script>-->
<script type="text/javascript" src="scripts/table_edit.js"></script>
<script type="text/javascript" src="scripts/deletefootable_row.js"></script>
<script type="text/javascript">
$(function() {
$( "#date" ).datepicker({
dateFormat: 'yy/mm/dd',
changeMonth: true,
changeYear: true
});
});
</script>
<script>
$(document).ready(function(e) {
var refresher = setInterval("update_content();",60000); // 60 seconds
})
function update_content(){
$.ajax({
type: "GET",
url: "main.php", // post it back to itself - use relative path or consistent www. or non-www. to avoid cross domain security issues
cache: false, // be sure not to cache results
})
.done(function( page_html ) {
// alert("LOADED");
var newDoc = document.open("text/html", "replace");
newDoc.write(page_html);
//alert(page_html);
newDoc.close();
});
}
</script>
</body>
</html>
jquery's .load() method does exactly this:
function update_content() {
$('#divGrid').load('main.php #divGrid>table');
}
This is my view of page.
This is the code of above page.
When i click on any page button i got that page script in alert(data). but i want from here only rows of this page and
append below the existing rows
.
<script>
$( document ).ready(function() {
$('button[id^="next"]').on('click', function() {
var page = ($(this).attr('value'));
$.ajax({
type: "GET",
url: 'index.php?act=product',
data: ({page:page}),
success: function(data) {
alert(data); // what to do i here. please suggest me.
}
});
});
});
</script>
My existing rows is here
<tbody>
<?php foreach($products as $product){ ?>
<tr>
<td class="text-center"><input name="checkbox[]" type="checkbox" value="<?php echo $product['product_id']; ?>"></td>
<td class="text-center"><?php echo $product['name']; ?></td>
<td class="text-center"><?php echo $product['sku']; ?></td>
<td class="text-center"><?php echo $product['status']; ?></td>
<td class="text-center"><?php echo $product['date_time']; ?></td>
<td class="text-center"> Edit</td>
</tr>**//here in the last but this is dynamic <tr>.**
<?php } ?>
</tbody>
Sample of alert(data) is below.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!----amit bootstrap---->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<link rel="stylesheet" href="view/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="view/css/style.css">
<script src="view/js/jquery.min.js"></script>
<script src="view/bootstrap/js/bootstrap.min.js"></script>
<!--validation code start------->
<link rel="stylesheet" href="view/css/jquery-ui.css"/>
<script src="view/js/jquery-ui.js"></script>
<script src="view/js/jquery.validate.min.js"></script>
<script src="view/js/additional-methods.min.js"></script>
<!-- amit bootstrap end ---->
</head>
<script>
function ToggleAll(source) {
var checkboxes = document.getElementsByName('checkbox[]');
for(var i=0, n=checkboxes.length;i<n;i++) {
checkboxes[i].checked = source.checked;
}
}
</script>
<script>
$( document ).ready(function() {
$('button[id^="next"]').on('click', function() {
var page = ($(this).attr('value'));
$.ajax({
type: "GET",
url: 'index.php?act=product',
data: ({page:page}),
success: function(data) {
alert(data);
}
});
});
});
</script>
<body>
<div class="jumbotron text-center">
<h2>View Upload Product</h2>
</div>
<div class="col-sm-12 menu">
<div class="row">
<div class="col-sm-1"></div>
<div class="col-sm-9 text-right"> Back </div>
<div class="col-sm-1 text-right"> Logout </div>
<div class="col-sm-1"></div>
</div><br/>
</div>
<div class="col-sm-12">
<div class="row">
<div class="col-sm-1"></div>
<form role="form" name="deleteproduct" id="deleteproduct" method="POST" action="index.php?act=deleteproduct" class="form-horizontal">
<div class="col-sm-10">
<div class="row">
<div class="col-sm-10"> </div>
<div class="col-sm-2 text-center"><button class="btn btn-primary btn-md" type="submit" name="delete" value="delete">Delete</button></div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th class="text-center"><input type='checkbox' name='checkall' onclick='ToggleAll(this);'></th>
<th class="text-center">Name</th>
<th class="text-center">SKU</th>
<th class="text-center">Status</th>
<th class="text-center">Date & Time</th>
<th class="text-center">Action</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center"><input name="checkbox[]" type="checkbox" value="27"></td>
<td class="text-center">test</td>
<td class="text-center">123</td>
<td class="text-center">Y</td>
<td class="text-center">2015-08-14 17:38:29</td>
<td class="text-center"> Edit</td>
</tr>
<tr>
<td class="text-center"><input name="checkbox[]" type="checkbox" value="28"></td>
<td class="text-center">test2</td>
<td class="text-center">1qas</td>
<td class="text-center">Y</td>
<td class="text-center">2015-08-14 17:38:29</td>
<td class="text-center"> Edit</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 text-center">
<button class="btn btn-default btn-md" type="submit" name="magento" value="magento">Magento Upload</button>
</div>
</div>
</div>
</form>
<div class="col-sm-1"></div>
</div>
</div>
<div class="col-sm-12"><br/>
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-8 text-center">
<button class='btn page' id='next1' value='1'>1</button><button class='btn page' id='next2' value='2'>2</button> </div>
<div class="col-sm-2"></div>
</div>
</div>
</body>
</html>
Depending on your ajax response format, if it where json, it could be done like this:
$.ajax({
type: "GET",
url: 'index.php?act=product',
data: ({page:page}),
success: function(data) {
var my_data = jQuery.parseJSON(data);
for (var i = 0; i < my_data.length; i++) {
var my_row = $('<tr>');
var my_html = '<td>'+my_data[i].field+'</td>';
my_html += '<td>'+my_data[i].field2+'</td>';
my_row.html(my_html);
$('tbody').append(my_row);
}
}
});
EDIT: But given your code, you need to parse the and append them to your DOM
-EDIT: If you need to make the call just once:
var requestDone = false;
$( document ).ready(function() {
$('button[id^="next"]').on('click', function() {
if( !requestDone) {
$.ajax({
type: "GET",
url: 'index.php?act=product',
data: ({page:page}),
success: function(data) {
var my_rows = $(data).find('tbody').html();
$('tbody').append(my_rows);
requestDone = true;
}
});
}
});
});
I got some problems with my JavaScript!
<form action="addcategory.php" name="addContact">
<input id="category" name="category" type="hidden" value="" />
</form>
This is my form... nothing special here.
function addCategory(){
if(document.getElementById('category').value = prompt("Indtast ny kategori", "Ny kategori")){
document.forms['addContact'].submit();
}
}
This is the JavaScript.
The JavaScript is placed AFTER the form, so the DOM is loaded.
<div onclick="addCategory()" class="save">Ny kategori</div>
That's the div that triggers the function... The div is placed at the beginning og the page, but should not make any difference.
When I click the div, a prompt comes up, I enter a string and press OK, but then i get the follow error: "Cannot call method 'submit' of undefined"
Please help, this is so annoying!
EDIT:
<?php
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SimpleCRM | Kategorier </title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="search_bar">
<a href="../"><div id="logo">
SimpleCRM
</div></a>
<div class="wrapper">
<div class="floats" style="float: left">
<table>
<tr>
<td>
<?php
?></td>
</tr>
<tr>
<td id="menu">
<div onclick="addCategory()" class="save">Ny kategori</div>
<div onclick="editContact()" class="button">Omdøb kategori</div>
<div id="delete" onclick="deleteContact()" class="button">Slet kategori</div>
</table>
</div>
<div class="floats" style="float: right">
<table>
<tr>
<td align="right">
<?php
?>
</td>
</tr>
<tr>
<td align="right">
<div onclick="wnidow.location = 'categories.php'" id="changecategories">Administrer kategorier</div>
<div onclick="window.location = '../logout.php'" id="logout">Log ud</div>
</td>
</table>
</div>
</div>
</div>
<div align="center" class="wrapper">
<div id="categories">
<form>
<select size="20" name="category">
<?php
?>
</select>
</div>
<div style="width:500px;" class="wrapper">
<div onclick="window.location = '../CRM?CRM=' +Math.floor((Math.random()*1000)+1)" id="back">
Tilbage
</div>
</div>
</div>
<form action="addcategory.php" name="addCategory" id="addCategory">
<input id="category" name="category" type="hidden" value="" />
</form>
</body>
</html>
<script>
function deleteContact(){
if(confirm('ADVARSEL:\nDu er ved at slette denne kontakt!'))
{
document.forms['delete'].submit();
}
}
function editContact(){
window.location.href = document.URL + '&edit=true';
}
function addCategory(){
if(document.getElementById('category').value = prompt("Indtast ny kategori", "Ny kategori")){
console.log(document.forms);
document.forms.addCategory.submit();
}
}
</script>
This is my entire document (the PHP code has been removed), so i hope you can now see everything more clearly...
The problems is that you have a form tag inside another form element:
<form>
<select size="20" name="category">
...
<form action="addcategory.php" name="addCategory" id="addCategory">
...
</form>
This is invalid and the inner form tag is ignored, and hence an element with name or ID addCategory does not exist. Remove the first form tag, it doesn't seem to serve any purpose.
That's one if the reasons why proper indentation is important.