Search jQuery

jQuery Forum

jQuery Mobile

softwareg..

Form Post Update don't work

in jQuery Mobile • 4 months ago

Hi,

I have try this but not work, what it's my error? thanks

<script type="text/javascript">
$(document).ready(function() {
$("#submitCliente").click(function(e){
var formData = $("#updateClienteForm").serialize();
$.ajax({
type: "POST",
url: "update_cliente.php",
cache: false,
data: formData,
success: onSuccess
});
e.preventDefault();
});
});
</script>

<div data-role="content" data-theme="c">
<form id="updateClienteForm" method="post">
<label for="ragioneSociale">Ragione Sociale:</label>
<input type="text" name="ragioneSociale" id="ragioneSociale" value="'.$r->RagioneSociale.'"/>
<label for="idCliente">idCliente:</label>
<input type="text" name="idCliente" id="idCliente" value="'.$r->idCliente.'"/>
<div button data-icon="check" data-theme="b" id="submitCliente" type="submit">Salva</button></div>
</form>
</div>

update_cliente.php

<?php
include 'connection.php';
$id_cliente = $_GET["idCliente"];
$RagioneSociale = $_GET["RagioneSociale"];
$sql = "UPDATE clienti SET RagioneSociale = ".$RagioneSociale." where idCliente = " . $id_cliente;
mysql_query($sql);
?>

Replies(10)

haga0054

Re: Form Post Update don't work

4 months ago

First big yellow box:

http://jquerymobile.com/demos/1.2.0/docs/api/events.html

softwareg..

Re: Form Post Update don't work

4 months ago

I have try so but not work

$(document).bind('pageinit')(function() {
$("#submitCliente").click(function(e){
var formData = $("#updateClienteForm").serialize();
$.ajax({
type: "POST",
url: "update_cliente.php",
cache: false,
data: formData,
success: onSuccess
});
e.preventDefault();
});
});

haga0054

Re: Form Post Update don't work

4 months ago

Have you tried to debug to see if you can find any issues?

softwareg..

Re: Form Post Update don't work

4 months ago

Unfortunately I can not debug in this language,

but I can tell you that when I press the button nothing happens

haga0054

Re: Form Post Update don't work

4 months ago

What? Why can't you debug javascript...

Here are my other thoughts.

$(document).on('pageinit', '#pageid', function() {

$("#submitCliente").on("click", function(e){

var formData = $("form#updateClienteForm").serialize();

$.ajax({

type: "POST",

url: "update_cliente.php",

cache: false,

data: formData,

success: onSuccess

});

e.preventDefault(); <----- Remove this? Not sure why you have it, maybe there is a reason

});

Along with this maybe add an alter before the ajax, and after to make sure it even posted.

EDIT: Add page identifier or the pageinit will get called on EVERY page init. The JQM Documentation really should be updated.

softwareg..

Re: Form Post Update don't work

4 months ago

Unfortunately, nothing happens when I press the update button.

<?php
include 'connection.php';
$conn = new PDO("mysql:host=$mysql_host;$mysql_db",$mysql_user,$mysql_pass);
$sql = "select * from clienti"; // limit 0,10"; // you may want to limit the results for big tables to the firs 10 by adding LIMIT 0,10 at the end of the query.
$result = mysql_query($sql);
?>
<!DOCTYPE html>
<html>
<head>
<title>MyApp Base</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<script type="text/javascript">
function resetTextFields()
{
$("#ragioneSociale").val("");
$("#citta").val("");
}
function onSuccess(data, status)
{
resetTextFields();
// Notify the user the new post was saved
$("#message").fadeIn(2000);
data = $.trim(data);
if(data == "OK")
{
$("#message").css("background-color", "#ffff00");
$("#message").text("Feed is saved");
window.location.href="clienti.php"
}
else
{
$("#message").css("background-color", "#ff0000");
$("#message").text(data);
}
$("#message").fadeOut(5000);
}
$(document).ready(function() {
$("#submit").click(function(e){
var formData = $("#newClienteForm").serialize();
$.ajax({
type: "POST",
url: "insert_cliente.php",
cache: false,
data: formData,
success: onSuccess
});
e.preventDefault();
});
});
$(document).on('pageinit', '#editCustomer', function() {
$("#submitCliente").on("click", function(e){
var formData = $("updateClienteForm").serialize();
$.ajax({
type: "POST",
url: "update_cliente.php",
cache: false,
data: formData,
success: onSuccess
});
});
});
</script>
<body>
<div data-role="page" id="elenco">
<div data-role="header">
<h1>Clienti</h1>
<a href="#addNewCustomer" data-icon="plus" data-role="add">Aggiungi</a>
</div>
<div data-role="content">
<ul data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Cerca..." >
<?php
$html;
while ($r = mysql_fetch_object($result)) {
echo '<li><a href="#editCustomer'.$r->idCliente.'">'.$r->RagioneSociale.'</a></li>';
$html .=
'<div data-role="page" id="editCustomer'.$r->idCliente.'" data-theme="a">
<div data-role="header">
<h1>Dati Cliente</h1>
<a href="clienti.php" data-icon="arrow-l" data-rel="back">Torna</a>
</div>
<div data-role="content" data-theme="c">
<form id="updateClienteForm" method="post">
<label for="ragioneSociale">Ragione Sociale:</label>
<input type="text" name="ragioneSociale" id="ragioneSociale" value="'.$r->RagioneSociale.'"/>
<label for="idCliente">idCliente:</label>
<input type="text" name="idCliente" id="idCliente" value="'.$r->idCliente.'"/>
<div button data-icon="check" data-theme="b" id="submitCliente" type="submit">Salva</button></div>
</form>
</div>
<div data-role="footer">
<h4></h4>
<a rel="external" href="delete_cliente.php?idCliente='.$r->idCliente.'" data-icon="delete" class="ui-btn-right">Elimina</a>
</div>
</div>';
}
?>
</ul>
</div>
<div data-role="footer">
</div>
</div>
<div data-role="page" id="addNewCustomer">
<div data-role="header">
<h1>Nuovo Cliente</h1>
</div>
<div data-role="content">
<form id="newClienteForm" method="post">
<div data-role="fieldcontain">
<input type="text" name="ragioneSociale" id="ragioneSociale" value="" placeholder="Ragione Sociale" />
<input type="text" name="citta" id="citta" value="" placeholder="Citta'"/>
<fieldset class="ui-grid-a">
<div class="ui-block-a"><a data-icon="delete" data-role="button" data-direction="reverse" data-rel="back">Annulla</a></div>
<div class="ui-block-b"><button data-icon="check" data-theme="b" id="submit" type="submit">Salva</button></div>
</fieldset>
<h3 id="#elenco"></h3>
</div>
</form>
</div>
<div data-role="footer">
<h1></h1>
</div>
</div>
<?php
echo $html;
?>
</body>
</html>

haga0054

Re: Form Post Update don't work

4 months ago

You didn't copy everything I posted. You need to have form before the form id to serialize - change to $("form#updateClienteForm").serialize();
Remove the document.ready()... just get rid of it/comment it out for testing.
There is quite a bit of content there. Try to create a small example and slowly rebuild. It's really hard to help with lots of code without being able to execute it myself.
You can always debug your javascript. I don't see why you can't. Do you use a browser to test? Look at the console, if no errors/warnings add a break point to your javascript and see where it gets stuck.

softwareg..

Re: Form Post Update don't work

4 months ago

Nothing to do, even in debug nothing happens, I've done several tests with a new file but nothing.

But I think the solution without Ajax for me that's okay.

To delete a record pace a parameter that is captured by a page delete.php, I could use a similar approach for the change.

But I need a little help on how to get the value of the inputText to be passed to update.php page.

<a rel="external" href="update_cliente.php?idCliente='.$r->idCliente.'&RagioneSociale=???????" data-icon="check" class="ui-btn-right">Aggiorna</a>

haga0054

Re: Form Post Update don't work

4 months ago

Just to double check first, is this page with all the scripting your starting page? The <head> only gets executed for the first page visited - so you should have the <head> be the same on every page. This is the most common error with JQuery Mobile. If you go to the page and manually refresh do the scripts run now? Just a though.

softwareg..

Re: Form Post Update don't work

4 months ago

Just to double check first, is this page with all the scripting your starting page?

Yes, i have only 1 page clienti.php

If you go to the page and manually refresh do the scripts run now?

No :(

Top Reply

Response title

Attachments

jQuery Forum

Form Post Update don't work

Replies(10)

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Re: Form Post Update don't work

Statistics

Tags

Actions

Related Posts