We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Post value from RitchTextEditors in loop to controller

Thread ID:

Created:

Updated:

Platform:

Replies:

148626 Oct 28,2019 01:08 PM UTC Nov 1,2019 06:37 PM UTC ASP.NET MVC - EJ 2 4
loading
Tags: RichTextEditor
Bart
Asked On October 28, 2019 01:08 PM UTC

Hi. I have a problem in my application. I render a RitchTextEditor in foreach loop for emails content like this:

   <div class="form-group" style="margin-top: 1rem;">
         @{
             int counter = 0;
         }
         @foreach (var item in Model.EmailsContents)
         {
             <div class="form-group">
                 <div class="card">
                     <div class="card-header">
                         <span class="pull-left font-weight-bold">
                             <span class="col-md-12 control-label label-required">@item.EmailType.GetDescription()</span>
                         </span>
                         <span class="pull-right">
                         </span>
                     </div>
                     <div class="card-body">
                         @Html.HiddenFor(m => item)
                         @(Html.EJS().RichTextEditor("rte12" + counter)
                                                             .ToolbarSettings(t => t.Items(new[] { "Bold", "Italic", "Underline", "StrikeThrough",
                                                              "FontName", "FontSize", "FontColor", "BackgroundColor",
                                                              "LowerCase", "UpperCase", "|",
                                                              "Formats", "Alignments", "OrderedList", "UnorderedList",
                                                              "Outdent", "Indent", "|",
                                                              "CreateLink", "Image", "|", "ClearFormat", "Print",
                                                              "SourceCode", "FullScreen", "|", "Undo", "Redo"  }))
                                                             .ShowCharCount(true)
                                                             .Height(300)
                                                             .Locale("pl-PL")
                                                             .Value(item.Content)
                                                             .MaxLength(10000)
                                                             .Render())
                         @Html.ValidationMessageFor(m => item.Content, "", new { @class = "text-danger" })
                     </div>
                 </div>
             </div>
             counter++;
         }
     </div>

I created counter property to distinguish each item. I don't know if it's good idea.
I have a 20 items in Model.EmailsContents so this foreach loop render a 20 ritchtexteditors with name from "rte120" "rte121" and so on.
The main problem is how to pass this data to controllers crud methods.

I was trying in this way:

$('#submit').on('click', function () {
            var text = document.getElementById("rte_rte-edit-view").innerHTML;
            var text120 = document.getElementById("rte120_rte-edit-view").innerHTML;
            var text121 = document.getElementById("rte121_rte-edit-view").innerHTML;
            var text122 = document.getElementById("rte122_rte-edit-view").innerHTML;
            var text123 = document.getElementById("rte123_rte-edit-view").innerHTML;
            var text124 = document.getElementById("rte124_rte-edit-view").innerHTML;
            var text125 = document.getElementById("rte125_rte-edit-view").innerHTML;
            var text126 = document.getElementById("rte126_rte-edit-view").innerHTML;
            var text127 = document.getElementById("rte127_rte-edit-view").innerHTML;
            var text128 = document.getElementById("rte128_rte-edit-view").innerHTML;
            var text129 = document.getElementById("rte129_rte-edit-view").innerHTML;
            var text1210 = document.getElementById("rte1210_rte-edit-view").innerHTML;
            var text1211 = document.getElementById("rte1211_rte-edit-view").innerHTML;
            var text1212 = document.getElementById("rte1212_rte-edit-view").innerHTML;
            var text1213 = document.getElementById("rte1213_rte-edit-view").innerHTML;
            var text1214 = document.getElementById("rte1214_rte-edit-view").innerHTML;
            var text1215 = document.getElementById("rte1215_rte-edit-view").innerHTML;
            var text1216 = document.getElementById("rte1216_rte-edit-view").innerHTML;
            var text1217 = document.getElementById("rte1217_rte-edit-view").innerHTML;
            var text1218 = document.getElementById("rte1218_rte-edit-view").innerHTML;

            return SubmitValidation(document.getElementById('form')) && (text) && (text120) && (text121) &&
             (text122) && (text123) && (text124) && (text125) && (text126) && (text127) &&
             (text128) && (text129) && (text122) && (text123);
        });

But.. This doesn't work, I would like to pass data from my ritchtexteditors like a array or json..

In controller add method I was trying:

var emailsContentsFromView = viewModel.EmailsContents;

                foreach (var item in emailsContentsFromView)
                {
                    var modelEmail = new EmailsContent()
                    {
                        Content = item.Content,
                        CreatedAt = DateTime.Now,
                        ProgramEdition = model,
                        EmailType = item.EmailType
                    };
                    _emailsContentDataAdapter.AddEmailContent(modelEmail);
                }

Do You have any ideas how to resolve my problem?
Thank's for Your help.
Regards :)

Pandiyaraj Muniyandi [Syncfusion]
Replied On October 29, 2019 06:54 PM UTC

Hi Bart, 

Currently, we were validating the reported issue with mentioned scenario and facing complexity to make CRUD based MVC application similar to your use case. If you have any reference link or sample and if it possible to share kindly provide, it will help us to provide solution at earliest. 

Regards 
Pandiyaraj 


Pandiyaraj Muniyandi [Syncfusion]
Replied On October 30, 2019 07:23 PM UTC

Hi Bart, 
  
Can you confirm following things to proceed further on this requirement 
  
- Are you facing value not accessible while submit value ? 
- Have you configured application similar to below CRUD project structure (Defined model property alone accessible with DB) ? 
- Are you process all RTE value to store into DB or going to make other action ? 
  
Regards, 
Pandiyaraj 


Bart
Replied On October 31, 2019 07:41 AM UTC

Hi Pandiyaraj, thanks for help.

1. I don't know if I have not accessible value because i don't know how to pass this value
2. Yes, this structure is similar to my. I have a dataAdapter which is responsible to get data from db.
3. In this case I process all RTE value to store into DB.

I don't know if I explained it correctly.

Pandiyaraj Muniyandi [Syncfusion]
Replied On November 1, 2019 06:37 PM UTC

Hi Bart, 
 
Thanks for your update. 
 
By adding FormCollection type argument additionally to post handling ActionResult method, we can access the all form fields value as follows 
 
 
        // POST: Mails/Edit/5 
        // To protect from overposting attacks, please enable the specific properties you want to bind to, for  
        // more details see https://go.microsoft.com/fwlink/?LinkId=317598. 
        [HttpPost] 
        [ValidateAntiForgeryToken] 
        [ValidateInput(false)] // Allowing html content access from form fields 
        public ActionResult Edit([Bind(Include = "Id,Content")] Mail mail, FormCollection formCollection) 
        { 
            string rteValue0 = formCollection["rte120"]; 
            string rteValue1 = formCollection["rte121"]; 
            string rteValue2 = formCollection["rte122"]; 
            string rteValue3 = formCollection["rte123"]; 
            string rteValue4 = formCollection["rte124"]; 
            if (ModelState.IsValid) 
            { 
                db.Entry(mail).State = EntityState.Modified; 
                db.SaveChanges(); 
                return RedirectToAction("Index"); 
            } 
            return View(mail); 
        } 
 
 
 
We have prepared sample for reference, get it from below link 
 
Note: In the above sample we configure Edit action alone. 
 
Regards, 
Pandiyaraj 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon