Question

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

以下是我正在使用的代码

TABS 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>

FORM MARKUP

 <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');
        } 
}

Answer 1

您应该使用ajax提交表单，然后呈现响应以代替表单。

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

Answer 2

你可以使用这样的东西......如果你使用的是jquery ui tabs ......

$('.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....

带有表单帮助的jquery选项卡

2 个答案: