0

I am trying to use a partial to display a modal that previews changes to a form. I am very close to getting it right, and this link gets me super close. The thing I can't figure out is how to pass my updated model to the partial view. I can send the Model's data just fine, but it only sends the Model's initial data. Here is my chart controller:

        [HttpGet]
        public ActionResult PreviewLine(LineChart previewModel)
        {
            return PartialView(previewModel);
        }

Should I be making this an HttpPost instead, to update the file?

And here is the modal and the button:

    <div id="previewModal" class="modal hide fade in" data-url="@Url.Action("PreviewLine", "Charts")">
        <div id="previewContatiner"></div>
    </div>
    <button type="button" class="btn btn-info" id="previewBtn">
        Preview
    </button>

I think it is supposed to generate more code when I call the following JQuery button (I am new to JQuery):

        <script>
        $(document).ready(function () {
            $("previewBtn").click(function () {
                var url = $("#previewModal").data("url");

                $.get(url, function (data) {
                    $("previewContainer").html(data);
                    $("previewModal").modal("show");
                });
            });
        });
        </script>

If you look at the previous link, you can see that I have drawn largely from that. However, it seems like I am missing something obvious in my approach. It also seems like clicking on the button isn't generating the code or calling the controller like I hoped.

  • Can you give more detail as to this: "I can send it just fine, but it always loads my initial data." ? Is the model in your backend method being sent correctly? I mean, does the model have all the expected data before passing it to the call to `return PartialView(previewModel)`? – Ryan Wilson Aug 27 '20 at 15:08
  • @RyanWilson I previously had a partial view directly in the html, but that would only load the model's initial data. I am trying to create a modal that will display the model's updated data. – David Wever Aug 27 '20 at 15:17

1 Answers1

0

David Wever, you've missed the (#) tagging.

$("previewBtn") i believe should be written as $("#previewBtn")

the same with other id $("previewContainer") and $("previewModal") should be: $("#previewContainer") and $("#previewModal")

every element you want to access with id in jQuery, it should be started with # and for the class attribute should be started with dot (.)

Steven
  • 99
  • 3