如何使用Symfony3和Ajax将tinyMCE textarea编辑器内容发送到内部控制器

时间:2018-04-21 07:25:53

标签: javascript jquery ajax symfony tinymce

我有两个名为#homepage,#thankyoupage的微型MCE编辑器,我想将tinymce textarea内容发送到symfony控制器内部。

这是我的前端部分:

enter image description here

我正在尝试使用jQuery ajax发送正常的textarea值,但是我得到了未定义的值。

$(document).ready(function () {
    var array_data = {};
    array_data['dedline'] = $('#homepage').val();
    array_data['homepage'] = $('#thankyoupage').val();
    array_data['thankyoupage'] = $('#deadlinetoanswer').val();
    $.ajax({
        type: 'POST',
        url: Routing.generate("invitation"),
        contentType: 'application/x-www-form-urlencoded',
        data: {
            data_array: array_data
        },
        success: function (result, status, xhr) {
            var res = JSON.parse(result);
            console.log(res);
        },
        error: function (xhr, status, error) {
            console.log('error1');
        }
    });
});

这是我的表单:

$builder->add('deadlinetoanswer', ChoiceType::class, array(
    'choices' => array(
        '2 days' => 2,
        '3 days' => 3,
        '5 days' => 5,
        '7 days' => 7,
        '10 days' => 10,
        '15 days' => 15,
        'Until' => 'until'
    )
));

$builder->add('prerecwelcomemsg', TextareaType::class, array(
    'required' => true,
    'attr' => array('class' => 'tinymce', 'id' => 'homepage', 'data-theme' => 'bbcode', 'style' => 'height: 380px', 'placeholder' => "Welcome...")
));

$builder->add('prerecthankyoumsg', TextareaType::class, array(
    'required' => true,
    'attr' => array('class' => 'tinymce', 'id' => 'thankyoupage', 'data-theme' => 'bbcode', 'style' => 'height: 380px', 'placeholder' => "Thank you...")
));

这是我的控制器:

/**
 * @Route("/prerecorded/invitation", name="invitation", options={"expose"=true})
 */
public
function invitationAction(Request $request) {
    $em = $this - > getDoctrine() - > getManager();
    $form = $this - > createForm(InvitationType::class);
    $form - > handleRequest($request);

    if ($request - > isXmlHttpRequest()) {
        $res_arr = $request - > request - > get('data_array');
        //   $this->container->get('logger')->addInfo('somesh'.$res_arr);           
        if ($res_arr) {
            $campaignid = 1;
            $campaign = $em - > getRepository('TraceBundle:Campaign') - > findOneBy(array('id' => $campaignid));
            $campaign - > setDeadlinetoanswer('');
            $campaign - > setPrerecwelcomemsg('hello');
            $campaign - > setPrerecthankyoumsg('how r u');
            $em - > persist($campaign);
            $em - > flush();
            return new Response(json_encode($campaignid));
        }
    }
    return $this - > render('TraceBundle:Campaign:invitation.html.twig', array(
        'form' => $form - > createView(),
    ));
}

和我的config.yml

stfalcon_tinymce:
    include_jquery: true
    tinymce_jquery: true
    selector: ".tinymce"
  #  base_url: "http://yourdomain.com/" # this parameter may be included if you need to override the assets_base_urls for your template engine (to override a CDN base url)
    # Get current language from the parameters.ini
    language: %locale%
    # Custom buttons
    tinymce_buttons:
        stfalcon: # Id of the first button
            title: "Stfalcon"
            image: "http://stfalcon.com/favicon.ico"

    theme:
        # Simple theme: same as default theme
        simple: ~

        # Advanced theme with almost all enabled plugins
        advanced:
             plugins:
                 - "advlist autolink lists link image charmap print preview hr anchor pagebreak"
                 - "searchreplace wordcount visualblocks visualchars code fullscreen"
                 - "insertdatetime media nonbreaking save table contextmenu directionality"
                 - "emoticons template paste textcolor"
             toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
             toolbar2: "print preview media | forecolor backcolor emoticons | stfalcon | example"
             image_advtab: true
             templates:
                 - {title: 'Test template 1', content: 'Test 1'}
                 - {title: 'Test template 2', content: 'Test 2'}
        # BBCode tag compatible theme (see http://www.bbcode.org/reference.php)
        bbcode:
             plugins: ["bbcode, code, link, preview"]
             menubar: false               
             toolbar1: "styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist "

这是我第一次使用tinyMCE编辑器,我真的不确定我做错了什么。请帮助我任何人,让我知道是否需要任何额外的信息。

提前致谢

1 个答案:

答案 0 :(得分:1)

1.在表单构建器中设置自定义id属性不会起作用。

有两种方法可以解决这个问题:

  • 不要更改默认ID

在您的脚本中,使用Symfony生成的默认id属性。对于简单属性,它是表单的名称和以下划线分隔的字段名称,因此您可以通过这种方式定位字段(选择器' id以'结尾):

array_data['homepage'] = $('[id$="_prerecwelcomemsg"]');
array_data['thankyoupage'] = $('[id$="_prerecthankyoumsg"]').val();
array_data['deadlinetoanswer'] = $('[id$="_deadlinetoanswer"]').val();

(*)检查渲染的html页面中生成的id属性是否确定 (**)请注意您交换了脚本中的字段,将array_data['dedline']设置为$('#homepage').val()

  • 如果您确实需要更改id属性:

使用以下内容渲染字段时,可以在模板中执行此操作:

{{ form_row(form.prerecwelcomemsg, { 'id': 'homepage' }) }}


2.您必须使用TinyMCE的方法来获取编辑的内容。

为此,要么:

  • 在获取字段值之前调用tinyMCE.triggerSave();
  • 或使用tinyMCE.get('fieldFullId').getContent();
  • 获取内容