How to get value from tinymce

Question

I am using tiny mce. I want to get the html elements from the textarea of tiny mce. I try to do tat with a ajax call. And I have a pdf button that will generate from the html a PDF. I have this:

public ActionResult GeneratePDFFOrProductHandler(EditProductModel model, string data)
{
    SubmittedForm sf = new SubmittedForm();
    string schema = requestSchema;
    customer_DbConnection db = new customer_DbConnection();
    RenderFormController renderController = new RenderFormController();
    renderController.GeneratePdf(data, db, sf);
    return RedirectToAction(model.DesignId, "Prdocut/Edit");
    //return View(model);
}

and the ajax call:

function GenerateHTMLTOPDF() {        
        $.ajax({
            type: "POST",
            url: '@Url.Action("GeneratePDFFOrProductHandler", "Product")',
            data: {},
            success: function (data) {

                alert(tinyMCE.get('tinymce').getContent());
                alert("data from ajax = " + data.toString()); // data is html               
                $("#tinymce").html(data);        // does not set anything
            },
            error: function (request, status, error) {
                alert(tinyMCE.activeEditor.getContent());

                alert(request.responseText);
            }
        });  

    }

The method in the controller is called. But data is every time null.

Thank you

For the button that Generate PDF is this:

 <button type="submit" value="GeneratePDFFOrProductHandler" id="btnGeneratePDF" onclick="GenerateHTMLTOPDF()" class="btn btn-success"><i class="fa fa-fw fa-check"></i> @Resources.Action.Navigation.GeneratePDF</button>     

But how to generate the pdf in a new tab of the browser?

Thank you

But If I try this:

 function GenerateHTMLTOPDF() {
        var data = tinyMCE.get('tinymce').getContent();
        $.ajax({
            type: "POST",
            url: '@Url.Action("GeneratePDFFOrProductHandler", "Product")',

            data: {data:data},
            success: function (data) {
                alert('success');                             
                alert("data from ajax = " + data.toString()); // data is html                               
            },
            error: function (request, status, error) {
                alert(tinyMCE.activeEditor.getContent());

                alert(request.responseText);
            }
        });  

    }

the controller method is even not called

Answer 1

Here

data: {},

you should have the data you intend to pass.

Instead of

return RedirectToAction(model.DesignId, "Prdocut/Edit");

at server side, you need to redirect inside your success function, by changing the value of window.location.href.

Answer 2

The data being sent to your controller is null because no data is being sent in your AJAX call.

This line:

data: {},

Should contain the data you wish to return.

In your case you can restructure your call as follows:

function GenerateHTMLTOPDF() {        
        $.ajax({
        var d = $('#tinymce').html( tinymce.get('tinymce').getContent() );

        dataType: 'json',
        type: "POST",
        url: '@Url.Action("GeneratePDFFOrProductHandler", "Product")',
        data: {d},
        success: function (data) {
             window.location.href = data;
        },
        error: function (request, status, error) {
             //Error handling
        }
    });  

}

Also you cannot redirect via an AJAX post, this line:

return RedirectToAction(model.DesignId, "Prdocut/Edit");

will not function as intended.

return Json(Url.Action("Prdocut", "Edit"));

The above will return JSON data with the window location that you can navigate to using javascript. This will not pass the pdf model that was created in GeneratePDF. You will have to restructure your code to do that as the current structure makes it difficult to achieve the functionality you are looking for.

AJAX is not meant to pass complex Objects back and forth similar to how controllers can, it passes data in the form of datatypes such as JSON/HTML/XML, full docs can be found here (navigate to datatypes). If necessary you can serialize an object, send it, change it in the backend, retrieve it as a JSON structure of a complex object and reassemble the object, however it's simpler and better practice to reevaluate what you are trying to do and creating a proper MVC architecture.