代码之家  ›  专栏  ›  技术社区  ›  Udders

带有表单帮助的jquery选项卡

  •  0
  • Udders  · 技术社区  · 14 年前

    我正在my site上实现jquery选项卡,其中一个选项卡保存一个表单,这是我的问题,表单是通过ajax加载的,因为它在整个站点中被多次使用。我的问题是,当表单提交时,页面会离开选项卡区域,而我需要留在选项卡系统中。

    下面是我正在使用的代码

    标签HTML

    <div id="tabs">
                    <ul>
                        <li><a href="#tabs-1">Active Categories</a></li>
                        <li><a href="#tabs-2">De-activated Categories</a></li>
                        <li><a href="<?=base_url();?>admin/addCategory">Add A New Category</a></li>
                    </ul>
    

    表单标记

     <div id="contact_form">
    <?php
        // open the form
        echo form_open(base_url().'admin/addCategory');
            // categoryTitle
            echo form_label('Category Name', 'categoryTitle');
            echo form_error('categoryTitle');
            $data = array(
                'name' => 'categoryTitle',
                'id' => 'categoryTitle',
                'value' => $categoryTitle,
            );
            echo form_input($data);
    
    
            // categoryAbstract
            $data = array(
                'name' => 'categoryAbstract',
                'id' => 'categoryAbstract wysiwyg',
                'value' => $categoryAbstract,
            );
            echo form_label('Category Abstract', 'categoryAbstract');
            echo form_error('categoryAbstract');
            echo form_textarea($data);
            // categorySlug
            $data = array(
                'name' => 'categorySlug',
                'id' => 'categorySlug',
                'value' => $categorySlug,
            );
            echo form_label('Category Slug', 'categorySlug');
            echo form_error('categorySlug');
            echo form_input($data);
            // categoryIsSpecial
            /*$data = array(
                'name' => 'categoryIsSpecial',
                'id' => 'categoryIsSpecial',
                'value' => '1',
                'checked' => $checkedSpecial,
            );
            echo form_label('Is Category Special?', 'categoryIsSpecial');
            echo form_error('categoryIsSpecial');
            echo form_checkbox($data);*/
            // categoryOnline
            $data = array(
                'name' => 'categoryOnline',
                'id' => 'categoryOnline',
                'value' => '1',
                'checked' => $checkedOnline,
            );
            echo form_label('Online?', 'categoryOnline');
            echo form_checkbox($data);
            echo form_error('categoryOnline');
            //hidden field check if we are adding or editing
            echo form_hidden('edit', $edit);
            echo form_hidden('categoryId', $categoryId);
            // categorySubmit
            $data = array('class' => 'submit', 'id' => 'submit', 'value'=>'Submit', 'name' => 'categorySubmit');
            echo form_submit($data);
            echo form_close();
        ?>
    </div>
    

    形成过程

    function saveCategory() {
        $data = array();
            // we need to set the what element the form errors get displayed in
            $this->form_validation->set_error_delimiters('<div class="formError">', '</div>');
            // we need to estabilsh some rules so the form can be submitted without error,
            // or if there is error then the form needs show errors.
            $config = array(
                        array(
                            'field' => 'categoryTitle',
                            'label' => 'Category title',
                            'rules' => 'required|trim|max_length[25]|xss_clean'
                            ),
                        array(
                            'field' => 'categoryAbstract',
                            'label' => 'Category abstract',
                            'rules' => 'required|trim|max_length[150]|xss_clean'
                            ),
                        array(
                            'field' => 'categorySlug',
                            'label' => 'Category slug',
                            'rules' => 'required|trim|alpha|max_length[25]|xss_clean'
                            ),
                        /*array(
                            'field' => 'categoryIsSpecial',
                            'label' => 'Special category',
                            'rules' => 'trim|xss_clean'
                            ),*/
                        array(
                            'field' => 'categoryOnline',
                            'label' => 'Category online',
                            'rules' => 'trim|xss_clean'
                            )
                    );
            $this->form_validation->set_rules($config);
            // with the validation rules set we can no run the validation rules over the form
            // if any the validation returns false then the error messages will be returned to the view
            // in the delimiters that we set further up the page.
            if($this->form_validation->run() == FALSE) {
                // we should reload the form
                $this->load->view('admin/add_category');
            } 
    }
    
    2 回复  |  直到 13 年前
        1
  •  0
  •   Reigel Gallarde    14 年前

    你可以用这样的东西…如果您使用的是jquery ui选项卡…

    $('.selector').tabs({ selected: <?=$_POST[selected]?$_POST[selected]:0?> });
    

    那么你的表格,你一定有这样的东西,

    <input type="hidden" name="selected" value="2" /> // value=2 if you want third tab selected... 0 if first....
    
        2
  •  0
  •   Goran Jurić    14 年前

    您应该使用ajax提交表单,然后用响应代替表单。

    或者您可以放置一个iframe,以便将表单加载到iframe中。