2016-07-18 258 views
6

Come posso utilizzare Ajax per passare una variabile Javascript a Php e recuperarli?Laravel Utilizzo di AJAX per passare la variabile Javascript in PHP e recuperare quelli

Sto usando un cursore dell'interfaccia utente Jquery e su ogni diapositiva voglio passare il valore del cursore javascript a php, per così dire.

Non ho esperienza (non molto) in Ajax e apprezzo davvero l'aiuto.

Ecco come il mio cursore appare:

$("#sliderNumCh").slider({ 
     range: "min", 
     min: 0, 
     max: 20, 
     step: 1, 
     value: numbersOfChapters, 
     change : function(e, slider){ 
      $('#sliderAppendNumCh').empty(); 
      var i = 0; 
      var sliderValue = slider.value; 
      var getSliderVal = document.getElementById('sliderValue').value = sliderValue; 

      $.ajax({ 
       type: 'POST', 
       url: '', 
       headers: {'X-Requested-With': 'XMLHttpRequest'}, 
       data: { 
        value: getSliderVal 
       }, 
       success: function (option) { 
        console.log(getSliderVal); 
       } 
      }); 
      ... 
     } 
    }) 

Il mio esempio percorso:

Modifica il mio percorso è simile al seguente ora:

Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => '[email protected]']); 

modifiche che cosa ho provato:

url: '{{ route("editProductWeb") }}', 

e ottenuto questo errore:

POST http://localhost/myApp/public/product/edit/%7BproductID%7D 500 (Internal Server Error) 

e provato questo:

url: 'edit', 

e ottenuto questo errore:

POST http://localhost/myApp/public/product/edit 500 (Internal Server Error) 

Modifica metodo mia modifica del controller:

public function editProduct($productRomID = 0) 
{ 
    $product = ProductRom::find($productID); 
    $sheets = Chapters::where('product_id', '=', $productID)->get(); 

    $productId = $product->id; 

    $sheetCount = count($sheets); 

    return view('product.edit', [ 
     'productId' => $productId, 
     'product' => $product, 
     'sheets' => $sheets, 
     'sheetCount' => $sheetCount, 
     'type' => 'edit', 
     'route' => 'updateProductRom' 
    ]); 
} 

Modifica utilizzando suggerimento haakym finora:

  $.ajax({ 
       type: 'post', 
       url: "{{ Route('editProduct', $product->id) }}", 
       headers: {'X-Requested-With': 'XMLHttpRequest'}, 
       data: { 
        value: getSliderVal, 
        productId : getPrId 
       }, 
       success: function (option) { 
        console.log(getSliderVal); 
       } 
      }); 

mi fa stampare l'id + il valore del cursore corrente nel mio di debug, in modo che funziona fino ad ora. Ora ho bisogno di ottenere quel valore e usarlo a mio avviso (php) qualche suggerimento su come procedere?

utilizzare questo nel mio metodo di controllo:

$sliderValue = $request->input('value'); 

mi restituisce

null

Edit Ho provato anche questo:

$sliderValue = Input::get('value'); 

che mi ha restituito anche

null

Edit ho aggiunto un registro:

Log::info(Input::all()); 

Questo dimostra il valore del cursore corretto e identificazione del prodotto sul vetrino. Ma il mio Input::get('value') mi null

restituisce comunque Edit Penso che dovrei aggiungere queste informazioni:

ho cambiato le rotte a questo ora:

Route::get('edit/{productID}', ['as' => 'editProduct', 'uses' => '[email protected]']); 
Route::post('edit/{productID}', ['as' => 'editProductPost', 'uses' => '[email protected]']); 

Il get mostra i dati dal database per un prodotto specifico e li mostra a mio avviso, ho aggiunto lo post uno per inviare i dati slidervalue al metodo editProductPost e restituisce in seguito il valore (sliderValue) nel vista edit, è questo corretto (Btw ancora non funziona)

EDIT

Se metto questo nel mio metodo di controllo:?

if ($request->isMethod('post')){ 
    return response()->json(['response' => 'This is post method']); 
} 

return response()->json(['response' => 'This is get method']); 

continuo a ricevere il seguente errore (se io scivolo):

POST http://localhost/myApp/public/product/edit/54 500 (Internal Server Error)

ho questo nella mia testa:

<meta name="csrf-token" content="{{ csrf_token() }}"> 

e mettere questo prima che il mio ajax postale:

 $.ajaxSetup({ 
      headers: { 
       'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
      } 
     }); 

EDIT:

In questo modo si restituisce il valore corretto scorrimento corrente nei log:

Log::info($request->get('value')); 

Ho provato questo :

return view('productRom.edit', [ 
     'value' => $value, 
    ]); 

ma ottengo un errore nella console:

Failed to load resource: the server responded with a status of 500 (Internal Server Error) http://localhost/myApp/public/product/edit/73

+0

Sembra buono da qui. Devi solo inserire l'URL del tuo controller/metodo nel tuo parametro $ .ajax 'url' e poi dovrebbe funzionare – Julqas

+0

ty, quindi devo aggiungere 'edit' nel' url' I postet il percorso di cui sopra nel domanda – utdev

+0

Puoi provare url: '/ edit', se non funziona prova l'URL completo :) – Julqas

risposta

0

Come @julqas dichiarato è necessario includere l'URL nel metodo $.ajax().

Come si dispone di un percorso di nome editProduct, è possibile uscita il collegamento con lo stelo:

$.ajax({ 
    type: 'POST', 
    url: '{{ route("editProduct" }}', 
    ... 

Edit 1:

Il percorso è get e il metodo di AJAX è post, credo che questo è il problema Devi renderli uguali.

Se si modifica il percorso su post, è necessario aggiungere il token CSRF alla richiesta Ajax quando viene inviato.V'è qualche indicazione sui documenti come farlo qui:

https://laravel.com/docs/5.2/routing#csrf-x-csrf-token

La documentazione raccomandano l'aggiunta di questo nella tua testa HTML:

<meta name="csrf-token" content="{{ csrf_token() }}"> 

quindi utilizzare il seguente codice prima di inviare la richiesta:

$.ajaxSetup({ 
     headers: { 
      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
     } 
}); 

in alternativa è possibile aggiungerlo alla richiesta nella chiamata ajax.

Edit 2

Un punto di lato - Stavo solo cercando di indovinare che cosa l'errore è, sarebbe stato meglio se ti avessi chiesto se si poteva eseguire il debug di voi stessi, al fine di vedere ciò che l'errore è stato . Imparare a eseguire il debug delle richieste Ajax è molto utile e non troppo difficile.

Il modo migliore per farlo è utilizzare la console di sviluppo nel browser preferito quando si effettua la richiesta ajax. Ad esempio, se utilizzi Chrome, apri Developer tools e fai clic sulla scheda Network prima di effettuare la richiesta. Dopo aver effettuato la richiesta è possibile controllare la richiesta e i suoi dettagli. Spero possa aiutare!

Edit 3

vorrei cambiare il metodo di editProduct() di non accettare qualsiasi parametro e invece ottenere il valore id per il prodotto dalla richiesta

public function editProduct() 
{ 
    // value here is referring to the key "value" in the ajax request 
    $product = ProductRom::find(\Request::get('value'); 
    ... 
} 

pensare di cambiare la chiave value in JSON a qualcosa di più utile, come productId

data: { 
    productId: getSliderVal 
} 
+0

Grazie ma ottengo questo errore 'POST http: // localhost/myApp/public/product/edit /% 7BproductID% 7D 500 (Internal Server Error)' – utdev

+0

grazie, l'ho cambiato (il percorso per postare, aggiunto il meta csrf e aggiunto l'ajax header before my ajax post) ma ottengo lo stesso errore – utdev

+0

@ JohnDoe2 controlla le mie modifiche, fammi sapere se non sono chiare! – haakym

0

non hai inserito il valore per 'url'. Crea qualsiasi percorso quindi mettilo in url: '{any_route_name}' e poi controlla in tempo di console il tuo valore è stato postato o meno

Devi fare qualche R & D al tuo livello per questo.