2009-10-14 3 views
10

Ho bisogno di serializzare tutti gli input da un modulo in una stringa JSON.
Con l'aiuto di this post, posso creare con successo una stringa valida come di seguito:jQuery: Come interrompere la funzione AJAX di escape della stringa JSON utilizzata per i dati POST

{"input01":"value01","input02":"value02","input03":"value03"} 

Tuttavia, quando si tenta di utilizzare la stringa di dati POST utilizzando la funzione Ajax jQuery, sembra aggiungere backslash alla stringa , con conseguente invio della stringa JSON utilizzando GET anziché POST. La pagina PHP caricata restituisce una matrice di $_GET:

[{\"input01\":\"value01\",\"input02\":\"value02\",\"input03\":\"value03\"}] => 

Ho testato la stringa JSON utilizzando alert() per confermare la struttura sia corretto prima di essere utilizzato nella funzione AJAX.
Inoltre, se si digita semplicemente manualmente la stringa JSON valida, AJAX registra correttamente i dati.

Il mio codice è il seguente:

var dataJSON = $.toJSON($('#form').serializeObject()); 
alert(dataJSON); 

$.ajax({ 
    type: "POST", 
    url: "ajax.php", 
    data: 'Query01=01&Query02=02', 
    dataType: 'json', 
    success: function(data){ 
     if (data==1){ 
     $('#wrap').load('ajax.php',dataJSON); 
     } 
    } 
}); 
+0

si sta chiamando '.ajax()', poi facendo una nuova richiesta Ajax con '.load()'. È corretto? –

+0

Roatin, è corretto. L'esempio sopra è semplificato dal mio vero copione. Lo script effettivo pubblica i dati utilizzando $ .ajax che deve essere convalidato, se validato correttamente, la funzione $ .load carica l'HTML generato dai dati inviati dalla stringa JSON. – ticallian

risposta

1

Dopo aver setacciato Google e il sito di jQuery, sono giunto alla conclusione personale che la funzione $.load convertirà qualsiasi variabile passata ad esso come un querystring (Come il mio problema originale sopra descritto). Se si desidera passare una stringa JSON attraverso di essa, deve essere digitata manualmente.

Per aggirare questo problema, ho utilizzato la funzione di livello basso $.ajax. Un vantaggio dell'utilizzo di questo metodo mi ha permesso di inviare anche dati POST utilizzando la funzione standard .serialize() anziché dover convertire i dati del modulo in JSON.

Il mio codice finale:

var formData = $('#form').serialize(); 

$.ajax({ 
    type: "POST", 
    url: "ajax.php", 
    data: 'Query01=01&Query02=02', 
    dataType: 'json', 
    success: function(data){ 
      if (data==1){ 
       $.ajax({ 
        type: "POST", 
        url: "ajax.php", 
        data: formData, 
        success: function(html){ 
         $("#wrap").replaceWith(html); 
        } 
       }); 
      } 
    } 
}); 

Se qualcun altro ha una soluzione, si prega di commentare.

+1

Poiché si utilizza php come lato server. Immagino che potresti aver usato la funzione php 'stripslashes()' –

11

Questo è il comportamento predefinito di $.ajax(). È possibile modificarlo impostando l'opzione processData su false. Vedi $.ajax() options.

data Object, String 

dati da inviare al server. È convertito in una stringa di query, se non è già una stringa. Viene aggiunto all'URL per le richieste GET. Vedere l'opzione processData per impedire l'elaborazione automatica di . L'oggetto deve essere chiave/valore coppie. JQuery serializza più valori con la stessa chiave i.e. {foo: ["bar1", "bar2"]} diventa '& foo = bar1 & foo = bar2'.

e

processData Boolean Default: true 

Per default, dati passati ai dati opzione come un oggetto (tecnicamente, altro che una stringa) sarà elaborati e trasformati in una query stringa, adatta al valore predefinito tipo di contenuto "application/x-www-form-urlencoded". Se si desidera inviare DOMDocuments o altri dati non elaborati, impostare l'opzione su false.

+0

Ho testato le informazioni che hai elencato sopra senza fortuna. Da quello che posso vedere le opzioni $ .ajax non influenzano la funzione $. Qualche idea su come potrei cambiare le stesse opzioni per $ .load? – ticallian

+0

@ticallian Non sono sicuro del motivo per cui è necessaria comunque la funzione di caricamento all'interno della funzione di successo. Non puoi semplicemente ottenere tutto ciò che ti serve nella richiesta $ .ajax usando il valore json? – Metropolis

+0

'processData: false' non ha restituito nulla –

2

essere sicuri che si

echo $_GET['varwithurl'] 

non

echo json_encode($_GET['varwithurl']) 

come molti esempi php web fare.

Invio i dati con l'url con $.ajax() e non vedo backslash indesiderati nello script php.

-2
<html> 
<head> 
<script src="resources/jquery-2.1.0.js"></script> 
<script src="resources/jquery.serializejson.min.js"></script> 
</head> 
<body> 
    <script> 

     $(document).ready(function(){ 

      $("#simplepost").click(function(e){ 

       var MyForm = $("#appForm").serializeJSON(); 
       console.log(MyForm); 

      $.ajax(
        { 
         url: "rest/emp/create", 
         type: "POST", 
         data: JSON.stringify(MyForm), 
         contentType: "application/json; charset=utf-8", 
         dataType: "json", 
         success:function(maindta){ 
          alert(maindta); 
         }, 
         error: function(jqXHR, testStatus, errorThrown){ 
          alert(errorThrown); 
         } 
        }); 
      e.preventDefault(); //STOP default action 
     }); 
    }); 
</script> 
<h2>Hello World!</h2> 
<form id="appForm" method="POST"> 
    EmployeeID:<input type="text" name='id' value="" /> 
    Employee Name:<input type="text" name="name" value=""/> 
<br> 
<input type="button" value="Submit" id="simplepost" /> 
</form> 
</body> 
</html> 
+2

I dump del codice senza spiegazione sono raramente utili. Per favore considera di aggiungere un contesto alla tua risposta. – Chris

0

ho fatto in modo che funzioni con stripslashes sul lato php.

Qualcosa di simile a questo:

$data = json_decode(stripslashes($_POST['json_data']));