AJAX表单提交Codeigniter

时间:2013-08-19 23:21:29

标签: jquery ajax forms codeigniter

我正在尝试使用ajax / jquery从视图提交表单到我的代码点火器模型。 如果已将post值传递给模型,则返回true。

我的观点是显示成功消息。 有人可以指出我哪里出错了吗?

以下是我的控制器的功能:

function bookings(){
            $this->load->helper('url');
            if($_POST):
                 echo $_POST["name"];

            // do database stuff here to save the comment.

            // return false if db failed

            // else

            return true;

        endif;
}

以下是相关的javascript&从视图形式:

<div id="booking-form-container" class="fb-dialogue">
            <div id="info">Entery your details below to make a group booking:</div>

            <!-- This will hold response / error message from server -->
            <div id="response"></div>

            <form id="bookingsform" method="post" action="eventguide/bookings">

                <label class="description" for="element_1">Full Name: </label>
                <div>
                    <input id="name" name="name" class="element text medium" type="text" maxlength="255" value="<?php echo $me['first_name'] . ' ' . $me['last_name']; ?>"/> 
                </div> 

                <label class="description" for="element_2">Email: </label>

                <div>
                    <input id="element_2" name="element_2" class="element text medium" type="text" maxlength="255" value="<?php echo $me['email']; ?>"/> 
                </div> 

                <label class="description" for="element_3">Mobile Number: </label>
                <div>
                    <input id="element_3" name="element_3" class="element text medium" type="text" maxlength="255" value=""/> 
                </div> 

                <label class="description" for="element_5">Choose You're Event: </label>
                <div>
                    <select class="element select medium" id="element_5" name="element_5"> 
                        <option value="" selected="selected"></option>
                        <option value="1" >First option</option>
                        <option value="2" >Second option</option>
                        <option value="3" >Third option</option>

                    </select>
                </div> 

                <label class="description" for="element_4">Group Size: </label>
                <div>
                    <input id="element_2" name="element_4" class="element text medium" type="number"  value="10"/> 
                </div> 

                <label class="description" for="element_6">Questions or Special Requirements? </label>
                <div>
                    <textarea id="element_6" name="element_6" class="element textarea medium"></textarea> 
                </div> 

            </form>
        </div>

        <script type="text/javascript">

            var mydetails = $("#booking-form-container").dialog({autoOpen: false, modal: true, draggable: true, resizable: false, bgiframe: true, width: '400px', zIndex: 9999, position: ['50%', 100]});

            function showDetailsDialog() {

                $("#booking-form-container").dialog("option", "title", "Group Bookings");


                $("#booking-form-container").dialog({buttons: {
                        "Close": {text: 'Close', priority: 'secondary', class: 'btn', click: function() {
                                $(this).dialog("close");
                            }},
                        "Confirm Booking": {text: 'Confirm Booking', priority: 'primary', class: 'btn btn-primary', click: function() {
                                $('#bookingsform').submit();
                            }}
                    }
                });
                $("#booking-form-container").dialog("open");

            }

            $("#bookingsform").submit(function(event) {
                event.preventDefault();


                dataString = $("#bookingsform").serialize();

                     $.ajax({
                       type: "POST",
                       url: "<?php echo base_url(); ?>eventguide/bookings",
                       data: dataString,

                       success: function(data){
                           alert('Successful!');
                       }

                     });

                     return false;  //stop the actual form post !important!
            });

        </script>  

3 个答案:

答案 0 :(得分:0)

你是真的回归谁?您回显的消息将返回到客户端,这是$ _POST ['name'],但是您的php代码中的返回true将在服务器端生成。 说到你使用codeigniter,我认为你应该使用$ this-&gt; input-&gt; post('name');而不是纯PHP的post服务器变量。

答案 1 :(得分:0)

您要做的是首先检查您的数据

if(isset($_POST) && isset($_POST['name'])) {
   // post is in the $_POST array, do stuff
   echo htmlspecialchars($_POST['name'], ENT_QUOTES, 'UTF-8');
}

答案 2 :(得分:0)

我认为您没有设置$ _POST [“name”],我认为您需要更改代码

$。AJAX({         类型:“POST”,         url:“eventguide / bookings”,         data:{'name':dataString},         成功:函数(数据){                警报( '成功!');         }   });

您没有为要在服务器端捕获的变量命名。