अजाक्स नौसिखिया सीखना (PHP JQuery)

Question

मैं AJAX के लिए नया हूं, मैं एक संपूर्ण पृष्ठ पढ़ने और ताज़ा किए बिना इसके अंदर एक तत्व बदलने की कोशिश कर रहा हूं।

मैं PHP & JQuery उपयोग कर रहा हूँ:

मैं एक पेज है कि इस तरह दिखता है। जब भी मैं tr पर क्लिक करता हूं, तो यह आईडी प्राप्त करता है और उस आईडी पर उस आईडी पर डीबी में निर्दिष्ट डेटा डालता है। तो मैं उपयोगकर्ता के डेटा को अद्यतन कर सकता हूं।

स्पष्ट रूप से जब फॉर्म खाली होता है तो यह डेटाबेस में मानक डालने वाला होता है।

जब आप प्रत्येक tr (एलिमिनेर) के अंतिम td पर क्लिक करते हैं, तो यह उस उपयोगकर्ता को डेटाबेस से हटा देता है।

मेरे फाइलें:

• एक नियंत्रक कि पेज (crud.php) बनाता है।
• एक डेटाबेस जिसमें प्रत्येक डेटाबेस से संबंधित विधि (डेटाबेस.php)
• सीएसएस फ़ाइलें और मूल HTML के साथ एक टेम्पलेट, जेएस शामिल है।

मैं अजाक्स के साथ सभी इस ताज़ा पृष्ठों बनाना चाहते हैं, लेकिन मैं की तरह कुछ मिलता है:

मेरे सभी पेज के बजाय नए के साथ मेरा पेज की जगह के रूप में सम्मिलित किया गया है , या केवल एक नए रूप के साथ फार्म की जगह।

कोई भी सुझाव/गाइड जो मुझे सीखने में मदद कर सकता है? मैंने इस साइट में सभी संबंधित AJAX सामग्री की खोज की है। इसके अलावा JQuery साइट ...

मैं सच में नहीं मिलता है कैसे AJAX के काम करता है और कैसे जे एस और PHP के साथ संबद्ध करने

प्रासंगिक कोड:

//Capturador de eventos 
$(document).ready(function(){ 
//Clickar en cualquier lado del tr (menos el ultimo td) para actualizar ese registro 
$("#tablaDatos tr td:not(:last-child").click(function() { 
    if (confirm("¿Seguro que desea modificar el registro?")){ 
     $("#idSelected").val($(this).closest('tr').attr('id')); 
     var data = $('#idSelected').serialize(); 
     $.post(
       'crud.php', 
       {data: data}, 
       function(response){ 
        $('#result').html(response); 
       } 
     ); 
     return false; 
    }else 
     return false; 
}); 

//Clickar en el borrar del listado para eliminar ese registro 
$("#tablaDatos input").click(function(){ 
    if (confirm("¿Seguro que deseas borrarlo del registro?")){ 
     $("#idSelected").val($(this).closest('tr').attr('id')); 
     $("#eliminar").val("Eliminar"); 
     var data = $('#idSelected').serialize(); 
     $.post(
       'crud.php', 
       {data: data}, 
       function(response){ 
        $('#result').html(response); 
       } 
     ); 
     return false; 
    }else 
     return false; 
}); 
// Clickar en Alta/Modificar para enviar los datos al crud a través de post 
$('#submit').click(function() { 
    var data = $('#envioDatos').serialize(); 
    $.post(
      'crud.php', 
      {data: data}, 
      function(response){ 
       $('#envioDatos').html(response); 
       $("#envioDatos input, textarea").val(''); 
      }); 
    return false; 
    }); 
}); 

<?php 
// INCLUDES 
include 'lib/pintarHTML.php'; 
include 'lib/database.php'; 

// VARS 
$tableName = 'ALEJANDRO'; 
$clientes = array(); 
$page = null; 
$body = null; 
$elemSel = null; 
$obj_pintar = new pintarHTML(); 
$ID = null; 
$result = null; 
$type = null; 

// CONECTION DB 
$obj = new database(); 

// POST READ 
if (isset ($_POST)) { 
    mpr($_POST); 

    if ($_POST['alta'] == "Alta" && empty ($_POST['id'])) { 
     // Llamo a insertar 
     $result = $obj->insert ($_POST); 
    } else 
    if ($_POST['modificacion'] == "Modificacion" && ! empty ($_POST['id'])) { 
     // Llamo a modificar 
     $result = $obj->update ($_POST); 
    } else 
    if ($_POST['eliminar'] == "Eliminar" && ! empty ($_POST['idSelected'])) { 
     // Llamo a eliminar 
     $result = $obj->delete ($_POST); 
    } else 
    if ($_POST['idSelected'] && empty ($_POST ['eliminar'])) { 
     // Elemento Seleccionado 
     $ID = $_POST['idSelected']; 
    } 
} 

// Client list 
$clientes = $obj->select ($tableName); 


// Title 
$body .= $obj_pintar->pintarTitulo ('LISTADO DE CLIENTES'); 


// Check ID 
if (isset ($ID)) { 
// Formulario relleno con los datos del usuario para modificarlos 
    $elemSel = $obj->select ($tableName, '*', 'id=' . $ID, null); 
    $body .= $obj_pintar->pintarFormulario ($elemSel); 
} else { 
    // Formulario vacío para alta de usuario 
    $body .= $obj_pintar->pintarFormulario ($elemSel); 
} 


// Page echo 
if (!empty($result)) { 
    $body .= $obj_pintar->pintarMessage($result); 
} 


$body .= $obj_pintar->pintarTable ($clientes); 

$page = $obj_pintar->composeHTML ($body); 

echo $page; 

// Debug 
function mpr($value, $text = null) { 
    echo "<pre>" . $text; 
    print_r ($value); 
    echo "</pre>"; 
} 
?> 

Answer 1

सामान्य अजाक्स में प्रयोग किया जाता है डेटा पर असीमित रूप से कुछ हेरफेर करने के लिए। आप अपने पेज पर कुछ क्लिक करते हैं, डेटा को कहीं और भेजने के लिए भेजा जाता है और उस मैनिपुलेशन का परिणाम प्रतिक्रिया के रूप में वापस कर दिया जाता है। फिर आप उस प्रतिक्रिया के आधार पर कार्य कर सकते हैं।

अपने मामले में, कहें कि आप कुछ क्लाइंट को हटाना चाहते हैं। आप अपने क्लाइंट DataEdit.php पर AJAX कॉल कर सकते हैं और उदाहरण के लिए एक विशिष्ट आईडी वाले छात्र को हटाने के लिए कह सकते हैं।

$.post("clientDataEdit.php", { function: "Delete", id: "#someID" }); 

फिर अपने php आप की जाँच क्या समारोह बुलाया जा रहा है तो फिर वापस ग्राहक पेज आप प्रतिक्रिया और उस पर कार्य को पकड़ने पर (इस मामले में हटाना) और आवश्यक हेरफेर

if(isset($_POST['function'])){ 
if(($_POST['function'])=="Delete"){ 
    //perform the manipulation and respond 
    echo "OK"; 
    } 
} 

प्रदर्शन :

$.post("clientDataEdit.php", { function: "Delete", id: "#someID" }) 
    .done(function(data) { 
    alert("Execution status: " + data); 
    }); 

यह आपको "निष्पादन स्थिति: ठीक" चेतावनी देना चाहिए। अगर यह ठीक था।आपको उस स्थानीय चेतावनी के साथ उस अलर्ट को प्रतिस्थापित करना चाहिए (उदाहरण के लिए फॉर्म को छुपाएं, दूसरे पृष्ठ पर अग्रेषित करें, एक और फॉर्म लोड करें, जो भी वास्तव में हो)।