• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Ajax, przesłanie danych z edytowalnego elementu do pliku php bez formularza.

0 głosów
49 wizyt
pytanie zadane 7 stycznia w JavaScript, jQuery, AJAX przez użytkownika mizeriowy Użytkownik (550 punkty)
edycja 7 stycznia przez użytkownika mizeriowy

Mam edytowalną tabelę z rekordami rekordy z bazy danych. Jak przesłać wyciągnąć te nowe nowe wartości i przesłać je do pliku update.php? Widziałem kilka rozwiązań z ukrytym inputem, jest jakieś bardziej eleganckie rozwiązanie?

 

<?php
$pageTitle = 'index';
$navLink = '<a href="form.php">' .'formularz</a>';
?>

<?php require_once 'snippets/header.php'; ?>

<?php require_once 'read.php'; ?>


    <div class="table-responsive mytable">
        <table class="table table-striped">
            <tr>
                <?php foreach($row as $key => $value): ?>
                    <th><?= $key ?></th>
                <?php endforeach; ?>
                <th>Action</th>
            </tr>
            <?php while($row2 = $statement2->fetch(PDO::FETCH_ASSOC)): ?>
                <tr>
                    <td class=""><?php echo $row2["Id"]?></td>
                    <td class="editableCell"><?php echo $row2["name"] ?></td>
                    <td class="editableCell"><?php echo $row2["surname"] ?></td>
                    <td class="editableCell"><?php echo $row2["age"] ?></td>
                    <td class="editableCell"><?php echo $row2["email"] ?></td>
                    <td class="editableCell"><?php echo $row2["date"] ?></td>
                    <td><button><i class="btn-danger fa fa-times"></i></button></td>
                </tr>
            <?php endwhile; ?>
        </table>
    </div>


<?php require_once 'snippets/footer.php'; ?>

 

 

function submitForm(){

    $('#myForm').submit(function(e){
        e.preventDefault();
        $.ajax({
            url:'create.php',
            type:'post',
            data:$('#myForm').serialize(),
            dataType: 'json',
            success:function(data){
                showMessage(data);
            },
        });
    });
}

function showMessage(data){
    if(data.status){
        if($('#ajax_msg').hasClass('alert-danger')){
            $('#ajax_msg').removeClass('alert-danger').addClass('alert-success');
            document.getElementById("myForm").reset();
        }
    }
    else {
        if($('#ajax_msg').hasClass('alert-success')){
            $('#ajax_msg').removeClass('alert-success').addClass('alert-danger');
        }
    };

    $('#ajax_msg').css("display", "block").delay(3000).slideUp(300).html(data.msg);
}

function makeElementEditable() {
    $(document).on("dblclick", ".editableCell", function() {
        $(this).prop('contenteditable', true);
    } );
}


$(document).ready(function(){

    submitForm();
    makeElementEditable();

});

 

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

0 głosów
2 odpowiedzi 180 wizyt
pytanie zadane 14 lutego 2016 w JavaScript, jQuery, AJAX przez użytkownika makoso Mądrala (7,410 punkty)
0 głosów
0 odpowiedzi 98 wizyt
pytanie zadane 1 listopada 2016 w JavaScript, jQuery, AJAX przez użytkownika Kuba Sumara Użytkownik (500 punkty)
0 głosów
1 odpowiedź 72 wizyt
pytanie zadane 30 października 2016 w JavaScript, jQuery, AJAX przez użytkownika Kuba Sumara Użytkownik (500 punkty)
...