web-dev-qa-db-ja.com

AJAXカスタムコンポーネント-エディターフィールドからのデータの投稿

「エディター」フォームフィールドからデータを投稿するのに苦労しています。 ajaxを使用せずにそれを実行すると、値が表示されますが、AJAXを使用すると、空白になります。

Array ( [subject] => asdasdasdasd [description] => [priority] => 3 [cc] => [bcc] => [id] => [created_by] => 688 )

[description]フィールド。テストでデータを入力しましたが、まだ空です。

私のjqueryはデータをシリアル化していて、エディターフィールドから値を見つけることができないようです。印刷しようとすると$data次のように出力されます。

詳細については、私のコードを参照してください：

JS：

jQuery(document).ready(function ($) {
    $('#request-form #submit').click(function (e) {
        $('#request-form').ajaxSubmit({
            url: 'index.php?option=com_helpdesk&task=request.save',
            type: 'POST',
            beforeSerialize: function($form, options) {
                // I was just trying to see what it prints. It is just showing the serialize form values
                console.log($form);
            },
            success: function (result) {
                var response = $.parseJSON(result);
                if (!response['success']) {
                    bootbox.alert(response['message']);
                }
                else {
                    bootbox.dialog({
                        title: "Success",
                        message: response['message']
                    });
                }
            }
        });
        e.preventDefault();
    });
});

コントローラ：

public function save($key = null, $urlVar = null)
{
        // Check for request forgeries.
        JSession::checkToken() or jexit(JText::_('JINVALID_TOKEN'));

        $model    = $this->getModel();
        $app      = JFactory::getApplication();
        $table    = $model->getTable();
        $key      = $table->getKeyName();
        $data     = $this->input->post->get('jform', array(), 'array');
        unset($data['userfile']);
        $recordId = $data[$key];

        if (!$this->allowSave($data, $key))
        {
            echo new JResponseJson(NULL, JText::_('COM_HELPDESK_ERROR_ACTION_NOT_PERMITTED'), TRUE);
            $app->close();
        }

        $form = $model->getForm($data, false);

        if (!$form)
        {
            echo new JResponseJson(NULL, JText::_('COM_HELPDESK_GENERAL_ERROR'), true);
            $app->close();
        }

        // Validate and Filter data by passing it to Model
        $data = $model->validate($form, $data);

        if (!$data)
        {
            echo new JResponseJson(NULL, JText::_('COM_HELPDESK_INVALID_DATA_ERROR'), true);
            $app->close();
        }

        if (!$model->save($data))
        {
            echo new JResponseJson($response, JText::_('COM_HELPDESK_SAVE_ERROR'), true);
            $app->close();
        }

        $isNew = $model->getState('request.new');

        if ($isNew)
        {
            $recordId = (int) $model->getState('request.id');
            $message  = JText::sprintf('COM_HELPDESK_REQUEST_NEW_SAVE_SUCCESS', $recordId);
        }
        else
        {
            $message = JText::sprintf('COM_HELPDESK_REQUEST_EDIT_SAVE_SUCCESS', $recordId);
        }

        $redirect = JRoute::_('index.php?option=' . $this->option . '&view=' . $this->view_list . $this->getRedirectToItemAppend(), false);
        echo new JResponseJson($redirect, $message);
        $app->close();
    }

フォームXML：

<field
            type="editor"
            label="COM_HELPDESK_REQUEST_DESCRIPTION_LABEL"
            name="description"
            class="form-control"
            height="225px"
        />

編集：

[保存]ボタンをクリックすると、テキスト領域にエディターが表示されますが、そのために非Ajaxメソッドを使用する必要がありました。私はそれをAJAX方法で行うことを望んでいます。

joomla-3.xjformajax
2
Sahil Purav

なんとかやってみました。私が知っている、これはそれを実装する最良の方法ではありません。 JSEからの専門家によるレビューをお待ちしています。

beforeSerialize JSのajaxSubmitプロパティを使用して、次のコードを追加しました。

beforeSerialize: function() {
                $('.wf_editor_toggle').click();
                $('.wf_editor_toggle').click();
            },

説明：

JCEエディターは、そのコンテンツを親にディスパッチしますtextarea保存またはエディターの切り替えボタンがクリックされた場合のみ。コンポーネントをAjax化しているため、ページが更新されないため、"Save"がデフォルトの動作を妨げます。

したがって、JCEコンポーネントから"Toggle Editor"ボタンを有効にして追加しました：

$('.wf_editor_toggle').click();

このコードは2回です。

初めて、通常のテキストエリアでエディターを切り替え、2番目のステートメントでは、元のエディターに切り替えます。 JCEがトグルエディターの状態を保存するために必要です（Cookieを使用する場合があります）。

より良い解決策があれば、評価できます。

1
Sahil Purav