将PartialView关联到页面模型

Question

I have a situation I can't solve alone... I have this object:

public class Service
{
    ...
    public Configuration Conf{get; set;}
    ...
}

public class Configuration 
{
    ...
    public List<Gateway> Gateways{get; set;}
    ...
}

Now I have a page to create a new service and I want to add runtime (client-side) a partial view. I have a page that accept as model the Service class.. and a partial view that have the gateway as model.. Everything seems to work..

@model ObjectModel.Entities.Configurations.Service
... 

@section scripts {
    <script type="text/javascript">
        function loadPartial(event) {
            event.preventDefault();
            event.stopPropagation();

            var $div = $(event.target).closest(event.data.divContainer),
                url = $(this).data('url'), model = event.data.model;

            $.post(url, function (model) {
                $div.prepend(model);
            });
        }

        $('#link_add_gateway').live('click', { divContainer: "#new_gateway", model: @Html.Raw(Json.Encode(Model)) }, loadPartial);
    </script>
}

...

<div id="new_gateway">           
    <a id="link_add_gateway" class="cursor_pointer"
        data-url='@Url.Action("RenderGateway", "Configuration")'>Aggiungi gateway</a>
</div>

<input type="submit" value="Create" class="btn btn-default" />

And here the controller:

 //EDIT: Now service is valorized here too..
 public ActionResult RenderGateway(Service service)
    {
        Gateway g = new Gateway();
        service.Configuration.Gateways.Add(g);  
        return PartialView("~/Views/_Partials/Gateway/Edit.cshtml", g);
    }

 [HttpPost]
 public ActionResult Create(Service service)
 {
     //Still nothing
 }

Here the problem : Service has no gateway valorized.. I think is correct, but I don't know how to solve it! I would like to associate the model of the partial view to the model of the page. How can I do?

thank you

UPDATE:

public class Configuration
{
    [XmlElement(ElementName = "gateway")]
    public GatewaysList Gateways { get; set; }

    public Configuration()
    {
        this.Gateways = new GatewaysList();
    }
}

[Serializable]
public class GatewaysList : List<Gateway>
{
    public Gateway this[int gatewayId]
    {
        get
        {
            return this.Find(g => g.GatewayId == gatewayId);
        }
    }
}

Answer 1

I think you shouldn't use get to do this call because you have to send parameters

So try something like this

$().ajax({method: 'POST', data: @Html.Raw(Json.Encode(Model)), //other parameters})

and then change

public ActionResult RenderGateway(ObjectModel.Entities.Configurations.Service service)
 {
    return PartialView("~/Views/_Partials/Gateway/Edit.cshtml",service);
 }

the key for your problem is to use @Html.Raw(Json.Encode(Model)) to reSend your Model over pages

update

this code came from my working project so I'm sure that works, try sending the parameter as a string and then deserialize it

 public ActionResult RenderGateway(string service)
 {
    var jsSettings = new JsonSerializerSettings();
    jsSettings.ReferenceLoopHandling = ReferenceLoopHandling.Ignore;
    var deserializedModel = JsonConvert.DeserializeObject<Service >(service, jsSettings);
    //now deserializedModel is of type Service 
    return PartialView("~/Views/Shared/something.cshtml", deserializedModel);
 }

update 2

I see from your GatewayList class that it's an indexer. They can't be serialized by xmlserializer You can do something like this

public class GatewaysList : List<Gateway>
{
      [XmlIgnore]
      public Gateway this[int gatewayId]
      {
        get
        {
           return this.Find(g => g.GatewayId == gatewayId);
        }
      }


       [XmlArray(ElementName="GatewaysList")]
       [XmlArrayItem(ElementName="Gateway", Type=typeof(Gateway))]
       public List<Gateway> GatewaysList
       {
          get
          {
          }
          set
          {

          }
       }
}

Answer 2

Solved... "Just" 1 row missed in my code... In my PartialView:

@using (Html.BeginCollectionItem("Configuration.Gateways"))

Now everything works correctly..

Ah... I have forgot to say that I had to install the BeginCollectionItem plugin and add to web.config the following line:

<add namespace="HtmlHelpers.BeginCollectionItem" />

in system.web.webPages.razor -> pages -> namespaces