Ich möchte zunächst sagen, dass ich mit Javascript und jQuery sehr neu bin. Ich nehme an, es ist ein sehr dummes und einfaches Problem, und ich bin mir bewusst, dass es dazu viele Fragen gibt, und ich habe alle ausprobiert. Obwohl ich mein Problem nicht lösen kann.

Ich habe ein Eingabefeld und eine Senden-Schaltfläche. Wenn Sie auf "Senden" klicken, möchte ich den Inhalt der in der Datenbank abgelegten Eingabe speichern und weiterhin auf derselben Seite mit dem Inhalt auf der Seite bleiben, wie er ist.

Mein Javascript-Code lautet wie folgt:

 <script type="text/javascript">
        $(document).ready(function()
        {
            $('#submit').submit(function(e)
            {

                e.preventDefault();
                var msg = $('#uname').val();
                $.post("c_test/test_submit", {uname: msg}, function(r) {
                   console.log(r);
                });
            });
        });
    </script>

Und mein HTML-Code wie folgt (ich benutze Codeigniter):

$this->load->helper('form');
echo form_open();
$data =array ('name'=>'uname','id'=>'uname');
echo form_input($data) . '<br />';
$data=array('name'=>'submit','id'=>'submit','value'=>'Submit');
echo form_submit($data);
echo form_close();

Ich wäre sehr dankbar, wenn jemand auf meine Dummheit hinweisen könnte. Vielen Dank!

3
idok 10 Okt. 2012 im 01:21

4 Antworten

Beste Antwort

Du benutzt

$('#submit').submit(function(e){ ... });

In diesem Fall ist submit das id id und es gibt kein solches Ereignis wie submit. Stattdessen können Sie das click Ereignis wie verwenden

$('#submit').click(function(e){ ... });

Oder

$('#submit').on('click', function(e){ ... });

Andernfalls können Sie die folgende Zeile ändern

echo form_open();

Zu

echo form_open('c_test/test_submit', array('id' => 'myform'));

Und statt

$('#submit').click(function(e){ ... });

Sie können verwenden

$('#myform').submit(function(e){
    e.preventDefault();
    var msg = $('#uname').val();
    var url=$(this).attr('action');
    $.post(url, {uname: msg}, function(r) {
        console.log(r);
    });
});

Oder

$('#myform').on('submit', function(e){
    e.preventDefault();
    var msg = $('#uname').val();
    var url=$(this).attr('action');
    $.post(url, {uname: msg}, function(r) {
        console.log(r);
    });
});
4
The Alpha 9 Okt. 2012 im 21:51

Vielleicht so:

$data=array('name'=>'submit','id'=>'submit','value'=>'Submit','onsubmit'=>'return false;');

Dadurch wird verhindert, dass das Formular veröffentlicht wird, wodurch die Seite nicht mehr aktualisiert wird. Es ist jedoch erforderlich, dass Sie das Formular über Ajax senden.

0
Travis J 9 Okt. 2012 im 21:23

Es scheint, dass das Element mit einem id von "submit" die Schaltfläche "submit" für das Formular - <input type="submit"> ist. Das Ereignis submit wird jedoch vom Formular und nicht von der Schaltfläche "Senden" ausgelöst, sodass Ihr gebundener Ereignishandler nicht ausgelöst wird.

Verschieben Sie entweder das "Submit" id in das Formular oder ändern Sie die Auswahl beim Binden des submit -Ereignishandlers:

$('form').submit(function(e) {
    // handle submit event from the form
});
1
Anthony Grist 9 Okt. 2012 im 21:25

Du musst es so machen:

<?php
$this->load->helper('form');

echo form_open('', array( 'id' => 'myform'));
..

Und:

 $('#myform').submit(function(e)
     {
            e.preventDefault();
            var msg = $('#uname').val();
            $.post("c_test/test_submit", {uname: msg}, function(r) {
               console.log(r);
            });

            return false;
     });

Das Senden-Ereignis wird immer an das Formular und nicht an die Formularschaltfläche gesendet.

1
John Skoumbourdis 9 Okt. 2012 im 21:26