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.
Unfortunately, activation email could not send to your email. Please try again.

pass information to dialog and recover using KO

Thread ID:

Created:

Updated:

Platform:

Replies:

125437 Aug 17,2016 10:08 PM Aug 22,2016 09:15 AM ASP.NET MVC 3
loading
Tags: Dialog
Juan Acosta
Asked On August 17, 2016 10:08 PM

Hi,
I'm integrating one application with Knockout and Synfusion. 

I have some doubts about the manage of the dialogs. 

https://help.syncfusion.com/aspnetmvc/dialog/how-to#create-a-confirmation-dialog-with-footer-section

I was following this page and I added custom events on OK or Cancel. 

However, the events are not triggered. 

<div class="control">
    @{
        Html.EJ().Dialog("basicDialog").Containment(".control").Title("Delete Container Confirmation").
            ContentTemplate(
            @<div class="cnt">
                The container will be permanently deleted and cannot be recovered. Are you sure?
            </div>
            ).Target(".control")
            .ShowOnInit(false)
            .EnableResize(false)
            .ShowFooter(true)
            .FooterTemplateId("sample")
            .ClientSideEvents(evt => evt.Close("onDialogClose")).Render();
    }
</div>

<script id="sample" type="text/x-jsrender">
    <div class="footerspan" style="float:right">

        @Html.EJ().Button("btn1").Size(ButtonSize.Mini).Height("30").Width("70").Text("Ok").ClientSideEvents(evt=>evt.Click("confirmDelete()"))

        @Html.EJ().Button("btn2").Size(ButtonSize.Mini).Height("30").Width("70").Text("Cancel").ClientSideEvents(evt => evt.Click("cancelDelete()"))

    </div>
    <!--<div class="condition" style="float:left; margin-left:15px">
        @Html.EJ().CheckBox("check1").Text("Dont ask me this again")
    </div>-->
</script>

<script>
        function openDialog() {
            $("#basicDialog").ejDialog("open");
        }
        function onDialogClose(args) {
            alert('Close');
        }
        function confirmDelete(args) {
            $("#basicDialog").ejDialog("close");
            alert('Delete');
        }
        function cancelDelete(args) {
            $("#basicDialog").ejDialog("close");
            alert('Cancel');
        }
    </script>

I'm calling the open function from KO view model. I was wondering if the events could be tied to the control and get a return of any flag with the user selection. 
ViewModel KO
$(document).on("click", ".kout-delete", null, function (ev) {
        var current = ko.dataFor(this);
        var selection = openDialog();
        if (selection=="OK")
              viewModel.lookupVCollection.destroy(current);
    });

Or if cannot return anything at least, that I can pass the current detail to the openDialog and into the     Html.EJ() .Dialog("dialog"). So, I won't lose the current detail.

Could you help me with this.

Kind regards.

Juan 


Narayanasamy Panneer Selvam [Syncfusion]
Replied On August 18, 2016 07:45 AM

Hi Juan Acosta,   
  
Thanks for contacting Syncfusion Support.   
   
 Query   
Solution   
However, the events are not triggered.   
We were able to reproduce this issue with the shared code. This is because you had used Click event name as function in the ClientSideEvents. Please view the code changes in the below code example block:   
   
@Html.EJ().Button("btn1").Size(ButtonSize.Mini).Height("30").Width("70").ClientSideEvents(evt=>evt.Click("Okbtn")).Text("OK") 
   
Calling the open function from KO view model   
We have prepared a sample with shared code using KnockOut, and the click event is working fine with our dialog control. We have prepared a sample with your requirements. Please find it in the sample link: http://www.syncfusion.com/downloads/support/directtrac/general/SYNCFU~2-2145978064.ZIP    
if cannot return anything at least, that I can pass the current detail to the openDialog and into the     Html.EJ() .Dialog("dialog"). So, I won't lose the current detail.   
 
To be clearer, opening a dialog doesn’t return any value. Can you please explain the exact scenario on what data you need to pass and which current detail should be maintained? Modify the shared sample based on your scenario and send it to us so that we can provide a solution.   
  
     
Regards,
Narayanasamy P. 


Juan Acosta
Replied On August 19, 2016 02:13 AM

Hi Narayanasamy,

I checked your solution and I found the issue. Also, I could connect to KO without any problems.
One question, could you check this ticket.
https://www.syncfusion.com/forums/125442/recover-dropdownlist-name-or-pass-additional-parameters-on-clientevents
The issue is kind of similar.
But the point is how to get the id of the referential object or pass an additional value in the events.
My point is how to pass values with the call reference. I notice the events have to be in the function name only
.ClientSideEvents(evt=>evt.Click("confirmDelete")
if I want something like
.ClientSideEvents(evt=>evt.Click("confirmDelete(10)")
having
function confirmDelete(args) {
}
The event stop working.

Could you give a hand with that.

Kind regards,
Juan





Narayanasamy Panneer Selvam [Syncfusion]
Replied On August 22, 2016 09:15 AM

Hi Juan Acosta, 
 
Thanks for your update.   
   
 Query   
Solution   
how to get the id of the referential object 
We can get the id of current element and  particular element by the following way. 
Code example: 
function onOpen(args) 
  { alert("the corresponding id is :"  + this.element[0].id);            } 
how to pass values with the call reference 
Currently we haven’t provided support for passing value to events. We have added it to our feature request list and it can be tracked through our Features Management System: 
 
  
  
Regards,
Narayanasamy P. 


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.

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.

;