Opóżnione wysłanie formularza

0

Witam,
Mam taki kod: (PHP)

<form action="logout.php" method="post">
      <input type="hidden" name="monety" id="monetyPodsumowanie" value=""/>
      <input type="hidden" name="farmy" id="farmyPodsumowanie" value=""/>
      <input type="hidden" name="pola" id="polaPodsumowanie" value=""/>
      <input type="hidden" name="chatki" id="chatkiPodsumowanie" value=""/>
      <input type="hidden" name="pracownicy" id="pracownicyPodsumowanie" value=""/>
      <input type="hidden" name="kamien" id="kamienPodsumowanie" value=""/>
      <input type="hidden" name="drewno" id="drewnoPodsumowanie" value=""/>
      <input type="hidden" name="chleb" id="chlebPodsumowanie" value=""/>
      <input type="hidden" name="mieso" id="miesoPodsumowanie" value=""/>
      <input type="submit" name="wyloguj" onClick="przeslijdane()" value="Wyloguj"/>
    </form>

JS:

function przeslijdane()
{
    document.getElementById("monetyPodsumowanie").value = monety;
    document.getElementById("farmyPodsumowanie").value = farmy;
    document.getElementById("polaPodsumowanie").value = pola;
    document.getElementById("chatkiyPodsumowanie").value = chatki;
    document.getElementById("kamienPodsumowanie").value = kamien;
    document.getElementById("pracownicyPodsumowanie").value = pracownicy;
    document.getElementById("drewnoPodsumowanie").value = drewno;
    document.getElementById("chlebPodsumowanie").value = chleb;
    document.getElementById("miesoPodsumowanie").value = mieso;
}

I jak mogę opóźnić wysłanie formularza, tak aby js mógł powsadzać te wartości (bo w pliku logout.php wyświetla tylko 4 pierwsze)? Wiem, że kod może jest źle napisany, ale zajmijmy się tym co w temacie :)

1

Hmm... takie coś może?

<form action="logout.php" method="post" onsubmit="return przeslijdane()">

W przeslijdane() daj na końcu return true;.

0

Delor napisał(a):

Hmm... takie coś może?
<form action="logout.php" method="post" onsubmit="return update_form()">
W update_form() zwróć true.

Takie: > onsubmit="return update_form(true)"

Czy w js zrobić funkcję update_form i tam dać true?

2

A czemu tego nie wyślesz ajaxem?

<form action="logout.php" method="post" id="form">
      <input type="submit" name="wyloguj" onClick="przeslijdane()" value="Wyloguj"/>
    </form>

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: url,
           data: {
               monety: monety
                itp. itd
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });


});

1

A więc z fetch api będzie to wyglądało tak. Chyba najprościej.

 <button onclick="logout()">Wyloguj</button>

Definiujesz sobie przycisk do wylogowania i robisz funkcję

function logout(){
// jeśli chcesz użyc $_POST w pliku php to musisz stworzyć FormData()
var formData = new FormData();
formData.append('monety', monety);
formData.append('farmy', farmy);
//itp, dodajesz sobie ile chcesz

fetch("logout.php", {
  method: "POST",
  body: formData, 
})
.then(response => response.json())
}

0

Mam takie o:

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: logout.php,
           data: {
               monety: monety
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });

});

I w konsoli pokazuje - > SyntaxError: missing } after property list[Więcej informacji] (109)
note: { opened at line 108, column 17

108 linijka to ta z data {...

0

Teraz

ReferenceError: $ is not defined

1

Nie masz jQuery załadowanego.

0

Dodałem linijkę od jQuey i nic nie pokazuje.
JS:

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: "logout.php",
           data: {
               monety: monety
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });

});

PHP:

echo "Monety:".$_POST['monety'];

0

Trochę go jest, ale ok. game.php:

<?php
  session_start();

  if($_SESSION['log'] == false)
  {
    header("location: zaloguj.php");
  }
?>

<!DOCTYPE HTML>
<html lang= "pl">
<head>
  <meta charset = "utf-8" />
  <title>Gra</title>
  <meta name="description" content= "test2" />
  <meta name= "keywords"content="Cytaty.pl" />
  <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-3.4.0.js" integrity="sha256-DYZMCC8HTC+QDr5QNaIcfR7VSPtcISykd+6eSmBW5qo="crossorigin="anonymous"></script>
  <link href="https://fonts.googleapis.com/css?family=Marck+Script" rel="stylesheet">
  <meta http-equiv="X-UA-Compatible" content= "IE=edge,chrome=1" />
  <script type="text/javascript" src="sklep.js"></script>
  <link rel="stylesheet" href="style.css" type="text/css"/>
  <link rel="shortcut icon" href="img/miniaturka.png">
</head>
<body>
  <?php include("pobierzmaterialy.php"); ?>

  <!-- .................................................................. -->

  <!-- Przesyłanie danych do JS -->
  <script>var mieso = <?= $row['mieso'];?></script>
  <script>var chleb = <?= $row['chleb'];?></script>
  <script>var kamien = <?= $row['kamien'];?></script>
  <script>var drewno = <?= $row['drewno'];?></script>
  <script>var monety = <?= $row['monety'];?></script>
  <script>var poziom = <?= $row['poziom'];?></script>
  <script>var chatki = <?= $row['chatki'];?></script>
  <script>var pola = <?= $row['pola'];?></script>
  <script>var farmy = <?= $row['farmy'];?></script>
  <script>var pracownicy = <?= $row['pracownicy'];?></script>
  

  <!-- Informacje o użytkowniku-->
  <div id="profil">
    <form action="logout.php" method="post" id="form">
      <input type="hidden" name="monety" id="monetyPodsumowanie" value=""/>
      <input type="hidden" name="farmy" id="farmyPodsumowanie" value=""/>
      <input type="hidden" name="pola" id="polaPodsumowanie" value=""/>
      <input type="hidden" name="chatki" id="chatkiPodsumowanie" value=""/>
      <input type="hidden" name="pracownicy" id="pracownicyPodsumowanie" value=""/>
      <input type="hidden" name="kamien" id="kamienPodsumowanie" value=""/>
      <input type="hidden" name="drewno" id="drewnoPodsumowanie" value=""/>
      <input type="hidden" name="chleb" id="chlebPodsumowanie" value=""/>
      <input type="hidden" name="mieso" id="miesoPodsumowanie" value=""/>
      <input type="submit" name="wyloguj" value="Wyloguj"/>
    </form>
  </div>


  <!-- Materiały gracza -->
  <div id="panel">
    <div id="mieso">Mięso: <?php echo $row['mieso'] ?></div>
    <div id="chleb">Chleb: <?php echo $row['chleb'] ?></div>
    <div id="kamien">Kamień: <?php echo $row['kamien'] ?></div>
    <div id="drewno">Drewno: <?php echo $row['drewno'] ?></div>
    <div id="monety">Monety:</div><div id="monetyilosc"><?php echo $row['monety']?></div>
  </div>


  <!--Sklep dla gracza-->
  <div id="sklep">
    <div class="produkt">
      <div class="zdjecie"><img src="img/domek.png"/></div>
      <div class="opis">Chatka</div>
      <input type="submit" name="kup" onClick="kupchatke()" value="KUP"/>
    </div>
    <div class="produkt">
      <div class="zdjecie"><img src="img/farma.png"/></div>
      <div class="opis">Farma</div>
      <input type="submit" name="kup" onClick="kupfarme()" value="KUP"/>
    </div>
    <div class="produkt">
      <div class="zdjecie"><img src="img/pole.png"/></div>
      <div class="opis">Pole</div>
      <input type="submit" name="kup" onClick="kuppole()" value="KUP"/>
    </div>
    <div class="produkt">
      <div class="zdjecie"><img src="img/pracownik.png"/></div>
      <div class="opis">Pracownik</div>
      <input type="submit" name="kup" onClick="kuppracownika()" value="KUP"/>
    </div>
  </div>


  <!--Mapa wioski-->
  <div id="wioska">
  </div>


  <!--Informacje o wyposażeniu wioski-->
  <div id="danewioski">
    <div id="pracownicy"><img src="img/pracownik.png"/><div id="pracownicyilosc"><?php echo $row['pracownicy']?></div></div>
    <div id="farmy"><img src="img/farma.png"/><div id="farmyilosc"><?php echo $row['farmy']?></div></div>
    <div id="pola"><img src="img/pole.png"/><div id="polailosc"><?php echo $row['pola']?></div></div>
    <div id="chatki"><img src="img/domek.png"/><div id="chatkiilosc"><?php echo $row['chatki']?></div></div>
  </div>

</body>
</html>

Sklep.js

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: "logout.php",
           data: {
               monety: monety
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });

});

Logout.php:

<?php
	session_start();
	echo "Monety:".$_POST['monety'];
	echo "Mięso:".$_POST['mieso'];
	echo "Chleb:".$_POST['chleb'];
	echo "Kamień:".$_POST['kamien'];
	echo "Drewno:".$_POST['drewno'];
	echo "Pracownicy:".$_POST['pracownicy'];
	echo "Farmy:".$_POST['farmy'];
	echo "Chatki:".$_POST['chatki'];
	echo "Pola:".$_POST['pola'];
	/*session_destroy();
	header("Location: zaloguj.php");*/
?>

Pobierzmaterialy.php:

<?php
    $login = $_SESSION['login'];
    $connect = mysqli_connect('localhost', 'root', '', 'gra');

if(isset($login))
{
    $dane = "SELECT * FROM gra WHERE login = '".htmlspecialchars($login, ENT_QUOTES)."'";
    $wynikdane = mysqli_query($connect, $dane);
    $row = mysqli_fetch_assoc($wynikdane);
}
    
?>

Wiem, że może nie jest najlepiej napisany, ale nie jestem profesjonalistą.

0

Gouda105 napisał(a):

Logout.php:

A więc powinno być Logout.php a nie logout.php

I zrób to tak:

Gouda105 napisał(a):

Sklep.js

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: url,
           data: {
               monety: monety
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });

});

A zmień adres w formularzu :)

0

Znalazł już ktoś coś?

1

Gouda105 napisał(a):

Znalazł już ktoś coś?

Próbuj sam, a nie czekaj na gotowca.

0

Po to tu jestem - skoro sam nic nie znajduję to was pytam.

1

Gouda105 napisał(a):

Po to tu jestem - skoro sam nic nie znajduję to was pytam.

Jasne pytaj, po to jest to forum. Ale nic nie szkodzi, żebyś w międzyczasie sam jeszcze coś kombinował. Po prostu Twój post można zinterpretować tak, że czekasz aż ktoś poda Ci gotowe rozwiązanie :)

0

Dziękuję wszystkim za pomoc. Udało się problem rozwiązać. Winowajcą była literówka w funkcji.

0

W tym moim pierwszym:

document.getElementById("chatkiyPodsumowanie").value = chatki;

chatkiy

0

$("#form").submit(function(e) {

    e.preventDefault(); // Zapobieganie standardowego wysyłania

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: url,
           data: {
               nazwa_pola_1: nazwa_pola_1,
nazwa_pola_2: nazwa_pola_2,
           },
           success: function(data)
           {
               alert(data); // jakbyś zwracał jakieś dane
           }
         });

});

Jak przekazac przez ten przyklad dwie nazwy z pola formularza (select) ? Potrzebuje tego do sortowania w poliku index.php. W ten sposob nie dziala

0

data:{ nazwa_jeden: "test", nazwa_dwa: "test, nazwa_trzy: "test" }

Twój przykład też jest dobry ale definiujesz gdzieś te wartości które chcesz przesłać?
Czyli nazwa_pola_2 i nazwa_pola_1

0

To moze inaczej
.Probuje zrobic przyklad ktory wysle dwie zmienne do pliku i posortje dane wzgledem wyboru. Plik ma nazwe 'tabela.php'/ Sam formularz jest rowniez w tym pliku.
To zwykly formularz z dwoma polami select. W tagu <form mam tylko padac id? bez action ??? i url pliku ???

        $(document).ready(function() {

                $('#submit').click(function() {
					
			

                    $.ajax({

                        type: "GET",

                        url: "tabela.php",

                        cache: 'false',

                       data: $("#form").serialize(),

                        beforeSend: function() {

                            $('.ajax').html('<img class="loader" />').show();

                        },

                        dataType: "html",

                        success: function(result) {

                            $("#error_message").html(result);

                            	$(".ajax").fadeOut("slow");

				  

                        },
                        error: function(xhr, ajaxOptions, thrownError) {

      alert('Something went wrong. Please try again.');


                            	$(".ajax").fadeOut("slow");

                        }
                    });


                    return false;

                });

            });

Na dole strony mam diva

Niby loader sie kreci ale nic sie nie wykonuje.

<input type="submit"  class="btn btn-primary active" id=submit  value="Finish">

<form method="post" ACTION="" id=form>";

Jest mozliwosc aby to zwrocilo wynik bez odswiezania ?

0

<form method="post" ACTION="" id="form"> powinno być

No a skoro nie używasz method i action to bez sensu to dawać.
<form id="form"> będzie coś takiego

Kod js też pasowałoby poprawić. Powinno być

$("#form").submit(function(e) {
    e.preventDefault();
...

zamiast

$('#submit').click(function() {
...

0

Dałem

<form method="post" id="form">

ale nic sie nie przekazuje. Wpisałem na samym poczatku pliku

echo  $_POST['zmiena'];

Zeby wyłapac wartosc ale nic nie ma:
Notice: Undefined index: SortType in C:\xampp\htdocs\edycja_usuwanie_ajax\tabela.php on line 43

0

No to pokaż plik tabela.php
Fajnie byłoby jakbyś pokazał też formularz.
A byłoby super jakbyś pokazał wszystko :)

0

tabela.php


<?php
include('required/header.php');
include('core/functions.php');
?>

<div id="wrapper">

<?php


$host="localhost";
$username="root@localhost";
$password="pwd";
$databasename="odswiezenie";
$conn=mysqli_connect($host,$username,$password);
$db=mysqli_select_db($conn, $databasename);

$ReturnSortValues = @$_GET['SortName'];
$ReturnSortType = @$_GET['SortType'];

$ReturnSortType = htmlspecialchars(addslashes($ReturnSortType));
$ReturnSortValues = htmlspecialchars(addslashes($ReturnSortValues));


(empty($ReturnSortValues)) ? $ReturnSortValues = 'bookingdate' : $ReturnSortValues = $ReturnSortValues;
(empty($ReturnSortType)) ? $ReturnSortType = 'ASC' : $ReturnSortType = $ReturnSortType;


$sql = "SELECT id, destination, ticketnumber, name, surename, phone, origin, tripday, bookingdate, bookedby FROM wycieczki ORDER BY " . $ReturnSortValues . " " . $ReturnSortType;
$result = mysqli_query($conn,$sql);


?>
<div class="container-fluid">

<?php

print $_POST['SortType'];

?>
  <div class="jumbotron">
    <h1>Orders control panel.</h1>
    <p>Edit and delete database records details live option. That option include an extra form fields where you can additional new database row with new tickets details. Option located end of page.</p>
  </div>

  
<?php
print ShowSortingForm( $argObj = true, $TabSortValues = array('destination', 'ticketnumber', 'name', 'surename', 'phone', 'origin', 'tripday', 'bookingdate', 'bookedby'), $TabSortType = array('ASC', 'DESC') );
?>

<table align="center" cellpadding="5" border="1" id="user_table" class="table table-hover" width=100%>
<tr>
<th>No.:</th>
<th>Destination</th>
<th>Ticket number</th>
<th>Name</th>
<th>Surename</th>
<th>Phone</th>
<th>Origin</th>
<th>Trip day</th>
<th>Booking date</th>
<th>Booked by</th>
<th>Action</th>
</tr>
<?php
$count = 1;
while ($row=mysqli_fetch_array($result)) 
{
 ?>
 <tr id="row<?php echo $row['id'];?>">
 <td width=10 class="table_orders"><?php echo $count;?></td>
  <td  class="table_orders" id="destination_val<?php echo $row['id'];?>"><?php echo $row['destination'];?></td>
  <td  class="table_orders" id="ticketnumber_val<?php echo $row['id'];?>"><?php echo $row['ticketnumber'];?></td>
  <td  class="table_orders" id="name_val<?php echo $row['id'];?>"><?php echo $row['name'];?></td>
  <td  class="table_orders" id="surename_val<?php echo $row['id'];?>"><?php echo $row['surename'];?></td>
  <td  class="table_orders" id="phone_val<?php echo $row['id'];?>"><?php echo $row['phone'];?></td>
  <td  class="table_orders" id="origin_val<?php echo $row['id'];?>"><?php echo $row['origin'];?></td>
  <td  class="table_orders" id="tripday_val<?php echo $row['id'];?>"><?php echo $row['tripday'];?></td>
  <td  class="table_orders" id="bookingdate_val<?php echo $row['id'];?>"><?php echo $row['bookingdate'];?></td>
  <td  class="table_orders" id="bookedby_val<?php echo $row['id'];?>"><?php echo $row['bookedby'];?></td>
  <td style="text-align:center">
   <input type='button' class="btn btn-primary" id="edit_button<?php echo $row['id'];?>" value="edit" onclick="edit_row('<?php echo $row['id'];?>');">
   <input type='button' class="btn btn-success" id="save_button<?php echo $row['id'];?>" value="save" onclick="save_row('<?php echo $row['id'];?>');">
   <input type='button' class="btn btn-danger" id="delete_button<?php echo $row['id'];?>" value="delete" onclick="if(confirm('Are you sure?')) delete_row('<?php echo $row['id'];?>');" >
  </td>
 </tr>
 <?php
 $count++;
}
?>

<tr id="new_row">
<td></td>
 <td><input type="text" class="form-control" id="new_destination" value="Type destination value"></td>
 <td><input type="text" class="form-control" id="new_ticketnumber"  value="Type ticket number value"></td>
 <td><input type="text"  class="form-control" id="new_name" value="Type name value"></td>
 
 <td><input type="text"  class="form-control"  id="new_surename" value="Type surename value"></td>
 <td><input type="text"  class="form-control"  id="new_phone" value="Type phone value"></td>
 <td><input type="text"  class="form-control"  id="new_origin" value="Type origin value"></td>
 
 <td><input type="text"  class="form-control"  id="new_tripday" value="Type trip day value"></td>
 <td><input type="text"  class="form-control"  id="new_bookingdate" value="Type booking date value"></td>
 <td><input type="text"  class="form-control"  id="new_bookedby" value="Type booked by value"></td>
 
 <td><input type="button" value="Insert new ticket details" class="btn btn-success" onclick="confirmR();"></td>
</tr>
</table>


</div>

<div class="ajax"></div>
<br><br><br><br>
</body>
</html>
<?php
mysqli_close($conn);
?>

plik: functions.php

<?php

				
					function ShowSortingForm($argObj, $TabSortValues, $TabSortMethod): string
					{
						$argObj  = "<div class=\"row\"><div class=\"col-md-2 col-sm-2 col-xs-12\"><form method=\"post\" id=form>";
						$argObj .= "<select name=\"SortName\" class=\"form-control input-sm\">";
						
						foreach($TabSortValues as $key1)
						{
							$argObj .= "<option value=" . $key1 . ">" . $key1 . "</option>";
						}
						
						$argObj .= "</select></div>";
						$argObj .= "<div class=\"col-md-2 col-sm-2 col-xs-12\"><select name=\"SortType\" class=\"form-control input-sm\"  style=\"width=100px;\">";
						
						foreach($TabSortMethod as $key2)
						{
							$argObj .= "<option value=" . $key2 . ">" . $key2 . "</option>";
						}
						
						$argObj .= "</select></div>";
						$argObj .= "<div class=\"col-md-2 col-sm-2 col-xs-12\"><input type=\"submit\" id=submit  class=\"btn btn-primary\">Sort data</button></div></div></form><br><br>";
						
						return $argObj;
					}
				
				
				
?>

W pliku tabela.php jest odwolanie do tej funkcji z formularzem

  
<?php
print ShowSortingForm( $argObj = true, $TabSortValues = array('destination', 'ticketnumber', 'name', 'surename', 'phone', 'origin', 'tripday', 'bookingdate', 'bookedby'), $TabSortType = array('ASC', 'DESC') );
?>

modify_records.js

function edit_row(id)
{
 var destination=document.getElementById("destination_val"+id).innerHTML;
 var ticketnumber=document.getElementById("ticketnumber_val"+id).innerHTML;
 var name=document.getElementById("name_val"+id).innerHTML;
 
 var surename=document.getElementById("surename_val"+id).innerHTML;
 var phone=document.getElementById("phone_val"+id).innerHTML;
 var origin=document.getElementById("origin_val"+id).innerHTML;
 
 var tripday=document.getElementById("tripday_val"+id).innerHTML;
 var bookingdate=document.getElementById("bookingdate_val"+id).innerHTML;
 var bookedby=document.getElementById("bookedby_val"+id).innerHTML;

 document.getElementById("destination_val"+id).innerHTML="<input type='text' class='form-control' id='destination_text"+id+"' value='"+destination+"'>";
 document.getElementById("ticketnumber_val"+id).innerHTML="<input type='text' class='form-control' id='ticketnumber_text"+id+"' value='"+ticketnumber+"'>";
 document.getElementById("name_val"+id).innerHTML="<input type='text' class='form-control' id='name_text"+id+"' value='"+name+"'>";
 
 document.getElementById("surename_val"+id).innerHTML="<input type='text' class='form-control' id='surename_text"+id+"' value='"+surename+"'>";
 document.getElementById("phone_val"+id).innerHTML="<input type='text' class='form-control' id='phone_text"+id+"' value='"+phone+"'>";
 document.getElementById("origin_val"+id).innerHTML="<input type='text' class='form-control' id='origin_text"+id+"' value='"+origin+"'>";
 
 document.getElementById("tripday_val"+id).innerHTML="<input type='text' class='form-control' id='tripday_text"+id+"' value='"+tripday+"'>";
 document.getElementById("bookingdate_val"+id).innerHTML="<input type='text' class='form-control' id='bookingdate_text"+id+"' value='"+bookingdate+"'>";
 document.getElementById("bookedby_val"+id).innerHTML="<input type='text' class='form-control' id='bookedby_text"+id+"' value='"+bookedby+"'>";
	
 document.getElementById("edit_button"+id).style.display="none";
 document.getElementById("save_button"+id).style.display="inline";
}

function save_row(id)
{
 var destination=document.getElementById("destination_text"+id).value;
 var ticketnumber=document.getElementById("ticketnumber_text"+id).value;
 var name=document.getElementById("name_text"+id).value;
 
 var surename=document.getElementById("surename_text"+id).value;
 var phone=document.getElementById("phone_text"+id).value;
 var origin=document.getElementById("origin_text"+id).value;
 
 var tripday=document.getElementById("tripday_text"+id).value;
 var bookingdate=document.getElementById("bookingdate_text"+id).value;
 var bookedby=document.getElementById("bookedby_text"+id).value;
	
 $.ajax
 ({
  type:'post',

  url:'modify_records.php',
  data:{
   edit_row:'edit_row',
   row_id:id,
   destination_val:destination,
   ticketnumber_val:ticketnumber,
   name_val:name,
   surename_val:surename,
   phone_val:phone,
   origin_val:origin,
   tripday_val:tripday,
   bookingdate_val:bookingdate,
   bookedby_val:bookedby
  },
  success:function(response) {
   if(response=="success")
   {
    document.getElementById("destination_val"+id).innerHTML=destination;
    document.getElementById("ticketnumber_val"+id).innerHTML=ticketnumber;
	document.getElementById("name_val"+id).innerHTML=name;
	
	document.getElementById("surename_val"+id).innerHTML=surename;
    document.getElementById("phone_val"+id).innerHTML=phone;
	document.getElementById("origin_val"+id).innerHTML=origin;
	
	document.getElementById("tripday_val"+id).innerHTML=tripday;
    document.getElementById("bookingdate_val"+id).innerHTML=bookingdate;
	document.getElementById("bookedby_val"+id).innerHTML=bookedby;
	
    document.getElementById("edit_button"+id).style.display="inline";
    document.getElementById("save_button"+id).style.display="none";
   }
  }
 });
}

function delete_row(id)
{
 $.ajax
 ({
  type:'post',
  url:'modify_records.php',
  data:{
   delete_row:'delete_row',
   row_id:id,
  },
  success:function(response) {
   if(response=="success")
   {
    var row=document.getElementById("row"+id);
    row.parentNode.removeChild(row);
	document.location.reload();
	
   }
  }
 });

}

function insert_row()
{
 var destination=document.getElementById("new_destination").value;
 var ticketnumber=document.getElementById("new_ticketnumber").value;
 var name=document.getElementById("new_name").value;
 
 var surename=document.getElementById("new_surename").value;
 var phone=document.getElementById("new_phone").value;
 var origin=document.getElementById("new_origin").value;
 
 var tripday=document.getElementById("new_tripday").value;
 var bookingdate=document.getElementById("new_bookingdate").value;
 var bookedby=document.getElementById("new_bookedby").value;

 $.ajax
 ({
  type:'post',
  url:'modify_records.php',
  data:{
   insert_row:'insert_row',
   destination_val:destination,
   ticketnumber_val:ticketnumber,
   name_val:name,
   surename_val:surename,
   phone_val:phone,
   origin_val:origin,
   tripday_val:tripday,
   bookingdate_val:bookingdate,
   bookedby_val:bookedby
  },
 
  success:function(response) {
	
   if(response!="")
   {
    var id=response;
    var table=document.getElementById("user_table");
    var table_len=(table.rows.length)-1;
    var row = table.insertRow(table_len).outerHTML="<tr id='row"+id+"'><td id='destination_val"+id+"'>"+destination+"</td><td id='ticketnumber_val"+id+"'>"+ticketnumber+"</td><td id='name_val"+id+"'>"+name+"</td><td id='surename_val"+id+"'>"+surename+"</td><td id='phone_val"+id+"'>"+phone+"</td><td id='origin_val"+id+"'>"+origin+"</td><td id='tripday_val"+id+"'>"+tripday+"</td><td id='bookingdate_val"+id+"'>"+bookingdate+"</td><td id='bookedby_val"+id+"'>"+bookedby+"</td><td><input type='button' class='edit_button' id='edit_button"+id+"' value='edit' onclick='edit_row("+id+");'/><input type='button' class='save_button' id='save_button"+id+"' value='save' onclick='save_row("+id+");'/><input type='button' class='delete_button' id='delete_button"+id+"' value='delete' onclick='delete_row("+id+");'/></td></tr>";

    document.getElementById("new_destination").value="";
    document.getElementById("new_ticketnumber").value="";
	document.getElementById("new_name").value="";
	
	document.getElementById("new_surename").value="";
    document.getElementById("new_phone").value="";
	document.getElementById("new_origin").value="";
	
	document.getElementById("new_tripday").value="";
    document.getElementById("new_bookingdate").value="";
	document.getElementById("new_bookedby").value="";
  }
  }
 });
}

function confirmR()
{
   if(confirm('Would you like additional table row ? \n If you can\'t see changes or can\'t edit or delete just generated record after clicking OK, please refresh the page.'))
   {
      insert_row();
	  setTimeout(function(){
      window.location.reload(); 
     }, 10);
	  
   }
}

Ten plik .js dolanczam w pliku header.php

<script type="text/javascript" src="modify_records.js"></script>

jak rowniez url do biblioteki jquery.
Plik "modify_records.php" okreslony w tym pliku .js sluzy do edycji, dodania i usuniecia rekordu z bazy danych. Ogolnie chodzi mi o to sortowanie.
Nie wiem jak przekazac tw dwie zmienne z formularza

0

[zdun2 napisał(a)]

Plik "modify_records.php" okreslony w tym pliku .js sluzy do edycji, dodania i usuniecia rekordu z bazy danych. Ogolnie chodzi mi o to sortowanie.
Nie wiem jak przekazac tw dwie zmienne z formularza

Te co są w select?
Jeśli tak to możesz to łatwo zrobić za pomocą jQuery.
$("select[name=SortName] option:checked").val()

0

MasterOf napisał(a):

[zdun2 napisał(a)]

Plik "modify_records.php" okreslony w tym pliku .js sluzy do edycji, dodania i usuniecia rekordu z bazy danych. Ogolnie chodzi mi o to sortowanie.
Nie wiem jak przekazac tw dwie zmienne z formularza

Te co są w select?
Jeśli tak to możesz to łatwo zrobić za pomocą jQuery.
$("select[name=SortName] option:checked").val()

Dobrodzieju. Mógłbyś mi ten mój przykład uzupełnić tak aby zadziałał ? Chodzi mi o to żeby podczas oczekiwania na posortowanie wyświetlił się loader. Wiem ze to ułamek sekundy czasami i mało w tym sensu ale po pierwsze taki bajer a po drugie czasem serwer moze nie odpowiadac i byłoby milo chociaz pokazac ze "cos sie robi"
W tym momencie loader sie pokazuje i znika (wiec wykonuje sie SUCCES) ale nie przekazuja sie zmienne z formularza.a co za tym idzie nic sie nie sortuje

1

Po pierwsze zmień wszędzie id, nie wstawiasz ". Na przykład:
<form method=\"post\" id=form> => <form method=\"post\" id=\"form\">
Ogólnie to możesz całość pozmieniać, żeby ci było wygodniej
"<div class=\"row\"><div class=\"col-md-2 col-sm-2 col-xs-12\"><form method=\"post\" id=form>"
=>
'<div class="row"><div class="col-md-2 col-sm-2 col-xs-12"><form method="post" id="form">'

$("#form").submit(function(e) {

                    e.preventDefault();

                    $.ajax({
                        type: "POST",
                        url: "tabela.php",
                        data: {
                            SortType: $("select[name=SortName] option:checked").val()
                        }
                        beforeSend: function() {
                            $('.ajax').html('<img class="loader" />').show();
                        },
                        success: function(result) {
                                $(".ajax").fadeOut("slow");
                                //result to odpowiedz z tabela.php
                                console.log(result);
                        },
                        error: function(xhr, ajaxOptions, thrownError) {
                                alert('Something went wrong. Please try again.');
                                $(".ajax").fadeOut("slow");
                        }
                    });
                });

0

MasterOf napisał(a):

Po pierwsze zmień wszędzie id, nie wstawiasz ". Na przykład:
<form method=\"post\" id=form> => <form method=\"post\" id=\"form\">
Ogólnie to możesz całość pozmieniać, żeby ci było wygodniej
"<div class=\"row\"><div class=\"col-md-2 col-sm-2 col-xs-12\"><form method=\"post\" id=form>"
=>
'<div class="row"><div class="col-md-2 col-sm-2 col-xs-12"><form method="post" id="form">'

$("#form").submit(function(e) {

                    e.preventDefault();

                    $.ajax({
                        type: "POST",
                        url: "tabela.php",
                        data: {
                            SortType: $("select[name=SortName] option:checked").val()
                        }
                        beforeSend: function() {
                            $('.ajax').html('<img class="loader" />').show();
                        },
                        success: function(result) {
                                $(".ajax").fadeOut("slow");
                                //result to odpowiedz z tabela.php
                                console.log(result);
                        },
                        error: function(xhr, ajaxOptions, thrownError) {
                                alert('Something went wrong. Please try again.');
                                $(".ajax").fadeOut("slow");
                        }
                    });
                });

Niestety nie działa. Tzn nie działa loader kiedy jest ta linijka:
`` data: {
SortType: $("select[name=SortType] option:checked").val()
}`
ale za to przekazują się te dwie zmienne. Natomiast kiedy ją usunę to loader działa ale znowu nie przekazują się zmienne c oza tym idzie nie mam danych potrzebnych do zapytania bazy danych.

0

Nie wiem co jest nie tak ale teraz jak usune te linijke z data {} to nie działa juz loader a wczensiej był. Nic nie robilem z tym.

<form method=\"post\" id=\"form\">

i plik .js

$("#form").submit(function(e) {

                    e.preventDefault();

                    $.ajax({
                        type: "POST",
                        url: "tabela.php",
                        data: {
                            SortType: $("select[name=SortType] option:checked").val()
 SortName: $("select[name=SortName] option:checked").val()
                        },
                        beforeSend: function() {
                            $('.ajax').html('<img class="loader" />').show();
                        },
                        success: function(result) {
                                $(".ajax").fadeOut("slow");
                            
                                console.log(result);
                        },
                        error: function(xhr, ajaxOptions, thrownError) {
                                alert('Something went wrong. Please try again.');
                                $(".ajax").fadeOut("slow");
                        }
                    });
                });

Co jest źle ?