Fatal编程技术网
  • ajax/
  • 在值更改事件上使用Razor语法调用Ajax.ActionLink

在值更改事件上使用Razor语法调用Ajax.ActionLink

ajax asp.net-mvc razor

在值更改事件上使用Razor语法调用Ajax.ActionLink,ajax,asp.net-mvc,razor,Ajax,Asp.net Mvc,Razor,我有一个视图，其中有一个供应商文本框、一个上个月下拉列表和一个月文本框 @using JouleBrokerDB.ViewModels; @model AssignPayReportToDepositViewModel @{ ViewBag.Title = "View"; } <link href="@Url.Content("~/Content/kendo/kendo.common-bootstrap.min.css")" rel="styl

我有一个视图，其中有一个供应商文本框、一个上个月下拉列表和一个月文本框

 @using JouleBrokerDB.ViewModels;
    @model AssignPayReportToDepositViewModel
    @{
      ViewBag.Title = "View";
    }
    <link href="@Url.Content("~/Content/kendo/kendo.common-bootstrap.min.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/kendo/kendo.bootstrap.min.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/kendo/kendo.dataviz.min.css")" rel="stylesheet" />
    <link href="@Url.Content("~/Content/kendo/kendo.dataviz.bootstrap.min.css")" rel="stylesheet" />
    <style>
      .treediv {
        display: inline-block;
        vertical-align: top;
        width: 440px;
        /*height:400px;*/
        min-height: 400px;
        text-align: left;
        margin: 0 2em;
        border-radius: 25px;
        border: 2px solid #8AC007;
        padding: 15px;
        overflow: auto;
      }
    </style>

    <div class="row">
      <div class="col-md-9 col-md-offset-1">
        @using (Html.BeginForm("Show", "AssignPayReportToDeposit", FormMethod.Post, new { id = "AssignToPayReportForm", @class = "form-horizontal" }))
        {
          <fieldset>

            <!-- Form Name -->
            <legend>Assign Pay Report to Deposit</legend>

            <div class="form-group">

              <!-- Supplier -->
              <div class="col-sm-4">
                @Html.Label("", "Supplier:", new { @class = "control-label", @for = "textinput" })
                <div id="suppliers">
                  @Html.DropDownListFor(x => x.SuppliersList, new SelectList(Model.SuppliersList, "SupplierID", "Name"), new { id = "ddSupplier", @class = "form-control" })
                </div>
              </div>

              <!-- Last Month -->
              <div class="col-sm-4">
                @Html.Label("", "Last Month:", new { @class = "control-label", @for = "textinput" })
                @Html.DropDownListFor(x => x.LastMonthsList, new SelectList(Model.LastMonthsList), new { @id = "ddLastMonth", @class = "form-control" })
              </div>

              <!-- Months-->
              <div class="col-sm-4">
                @Html.Label("", "Months:", new { @class = "control-label", @for = "textinput" })
                @Html.TextBox("txtMonths", null, new { type = "number", step = 1, min = 1, max = 12, @class = "form-control", required = "required" })
              </div>
            </div>
          </fieldset>

          <div class="treediv">
            @Html.Label("", "UnAssigned PayReport:", new { @class = "control-label", @for = "textinput" })
            <div id="TreeView_UPR" style="padding:5px"></div>
          </div>

          <div class="treediv">
            @Html.Label("", "Deposits:", new { @class = "control-label", @for = "textinput" })
            <h4></h4>
            <div id="TreeView_AD" style="padding:5px"></div>
          </div>
        }
      </div>
    </div>

    <script src="@Url.Content("~/Scripts/kendo/kendo.all.min.js")"></script>
    <script src="@Url.Content("~/Scripts/Views/AssignPayReportToDeposit/Show.js")"></script>
这些已更改的事件处理程序将处理刷新treeview的操作。整个过程都是通过ajax调用处理的

现在我知道，使用Ajax.ActionLink和带有Replace选项的UpdateTargetId参数，我可以在部分视图中返回treeview，这样就可以删除手动处理。但这将需要我把锚按钮，用户必须点击。要求是在任何标准更改时都应该刷新treeview

是否有任何方法可以通过使用Ajax.ActionLink（或任何其他可以减轻手动处理负载的razor语法）来实现这一点？在控件发生更改事件时，我想使用ajax.actionlink调用一个控制器，它将返回partialview并更新div

编辑：我现在正在通过jQuery处理这个问题。因此，我将发布完整的代码，以便更好地理解

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using JouleBrokerDB;
using JouleBrokerDB.ViewModels;
using JouleBroker.Filters;

namespace JouleBroker.Controllers
{
  [RoutePrefix("AssignPayReportToDeposit")]
  [Route("{action=Show}")]
  public class AssignPayReportToDepositController : Controller
  {
    // GET: AssignPayReportToDeposit
    //[Route("Show",Name = "APTDShow")]
    //[ValidateLogin]
    public ActionResult Show()
    {
      List<SupplierViewModel> suppliers = DBCommon.GetAllSuppliers(false);

      SuppliersList_LastMonthsList_ViewModel model = new SuppliersList_LastMonthsList_ViewModel()
      {
        SuppliersList = suppliers,
        LastMonthsList = new List<string>()
      };

      return View(model);
    }

    [HttpPost]
    [Route("GetUnAssignedPayReports")]
    public JsonResult GetUnAssignedPayReports(int SupplierID,
                                              string MonthPaid,
                                              int Months)
    {
      var payreports = AssignPayReportsToDepositData.GetUnAssignedPayReports(SupplierID,
                                                                             MonthPaid,
                                                                             Months);
      return Json(payreports);
    }

    [HttpPost]
    [Route("GetAssignedPayReports")]
    public JsonResult GetAssignedPayReports(int SupplierID,
                                            string MonthPaid,
                                            int Months)
    {
      var payreports = AssignPayReportsToDepositData.GetAssignedPayReports(SupplierID,
                                                                           MonthPaid,
                                                                           Months);
      return Json(payreports);
    }

    [HttpPost]
    [Route("AssignDepositIdToPayReport")]
    public bool AssignDepositIdToPayReport(int PayReportID, int DepositID)
    {
      return AssignPayReportsToDepositData.AssignDepositIdToPayReport(PayReportID, DepositID);
    }
  }
}

使用系统；
使用System.Collections.Generic；
使用System.Linq；
使用System.Web；
使用System.Web.Mvc；
使用JouleBrokerDB；
使用JouleBrokerDB.ViewModels；
使用JouleBroker.过滤器；
名称空间JouleBroker.Controllers
{
[RoutePrefix（“AssignPayReportToDeposit”）]
[路由（“{action=Show}”）]
公共类AssignPayReportToDepositController:控制器
{
//获取：AssignPayReportToDeposit
//[路线（“Show”，Name=“APTDShow”）]
//[ValidateLogin]
公共行动结果显示（）
{
列出供应商=DBCommon.GetAllSuppliers（false）；
供应商列表\u LastMonthsList\u ViewModel model=新供应商列表\u LastMonthsList\u ViewModel（）
{
供应商列表=供应商，
LastMonthList=新列表（）
};
返回视图（模型）；
}
[HttpPost]
[路线（“GetUnAssignedPayReports”）]
公共JsonResult GetUnAssignedPayReports（int SupplierID，
串月援助，
整数（个月）
{
var payreports=AssignPayReportsToDepositData.GetUnAssignedPayReports（供应商ID，
蒙特帕德，
月）；
返回Json（payreports）；
}
[HttpPost]
[路线（“GetAssignedPayReports”）]
公共JsonResult GetAssignedPayReports（int SupplierID，
串月援助，
整数（个月）
{
var payreports=AssignPayReportsToDepositData.GetAssignedPayReports（供应商ID，
蒙特帕德，
月）；
返回Json（payreports）；
}
[HttpPost]
[路线（“AssignDepositoidToPayReport”）]
public bool AssignDepositId ToPayReport（int PayReportID，int DepositID）
{
返回AssignPayReportsToDepositData.AssignDepositIdToPayReport（PayReportID，DepositID）；
}
}
}
JavaScript文件（代码有点长，因此您不需要查看所有代码，您可以看到调用操作方法的方法。GetUnAssignedPayReports和GetAssignedPayReports返回用于填充树视图的数据。）我只希望这部分移动到局部视图，并将模型传递到局部视图，在那里生成树视图，并在每次更改事件时用再次渲染局部视图替换div。希望我足够清楚。因此，请更改上述方法，以返回部分结果，而不是我试图获得的json结果

function AssignPayReportsToDeposit() { }

AssignPayReportsToDeposit.SelectedSupplierID = 0;
AssignPayReportsToDeposit.SelectedLastMonth = null;
AssignPayReportsToDeposit.SelectedMonths = 0;

AssignPayReportsToDeposit.LastMonthsList = null;
AssignPayReportsToDeposit.UnAssignedPayReportsList = null;
AssignPayReportsToDeposit.AssignedPayReportsList = null;

AssignPayReportsToDeposit.LastTextChangedNode = null;
//--------- Document Ready Function -------- //
$(document).ready(function () {

  //AttachEvents
  AssignPayReportsToDeposit.AttachEvents();
});

AssignPayReportsToDeposit.AttachEvents = function () {
  $("#ddSupplier").change(AssignPayReportsToDeposit.OnSupplierChange);
  $("#ddLastMonth").change(AssignPayReportsToDeposit.OnLastMonthChange);
  $("#txtMonths").change(AssignPayReportsToDeposit.OnMonthsChange);
}

//Handles Supplier ChangeEvents
AssignPayReportsToDeposit.OnSupplierChange = function () {
  //Get Changed Supplier ID
  AssignPayReportsToDeposit.SelectedSupplierID = $('#ddSupplier').val();
  //Get Last Month List
  AssignPayReportsToDeposit.LastMonthsList = CommonAction.GetLastPayReportMonthsBySupplierID(AssignPayReportsToDeposit.SelectedSupplierID);
  //Fill Last Month List
  AssignPayReportsToDeposit.FillLastMonths();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Handles Last Month Change Event
AssignPayReportsToDeposit.OnLastMonthChange = function () {
  AssignPayReportsToDeposit.SelectedLastMonth = $('#ddLastMonth').val();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Handles Month Change Event
AssignPayReportsToDeposit.OnMonthsChange = function () {
  AssignPayReportsToDeposit.SelectedMonths = $('#txtMonths').val();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Fills Last Month Dropdown with options
AssignPayReportsToDeposit.FillLastMonths = function () {
  var ddLastMonth = $("#ddLastMonth");
  if (ddLastMonth != undefined) {
    ddLastMonth.empty();
    if (AssignPayReportsToDeposit.LastMonthsList != undefined) {
      $.each(AssignPayReportsToDeposit.LastMonthsList, function () {
        Common.AddOptionToSelect(ddLastMonth, this.Text, this.Text);
      });
      ddLastMonth.val(AssignPayReportsToDeposit.LastMonthsList[0].Text);
      AssignPayReportsToDeposit.SelectedLastMonth = ddLastMonth.val();
    }
  }
}

AssignPayReportsToDeposit.ValidateControls = function () {
  var success = true;
  if (AssignPayReportsToDeposit.SelectedSupplierID == undefined ||
      AssignPayReportsToDeposit.SelectedSupplierID == 0) {
    //  bootbox.alert('Please select a Supplier');
    success = false;
  }
  else if (AssignPayReportsToDeposit.SelectedLastMonth == undefined ||
          AssignPayReportsToDeposit.SelectedLastMonth == '') {
    //   bootbox.alert('Please select Last Month');
    success = false;
  }
  else if (AssignPayReportsToDeposit.SelectedMonths == undefined ||
          AssignPayReportsToDeposit.SelectedMonths == 0) {
    //  bootbox.alert('Please Enter Months');
    success = false;
  }
  return success;
}

//Assigns DepositIdToPayReport
AssignPayReportsToDeposit.AssignDepositIdToPayReport = function (PayReportID, DepositID) {
  var success = false;
  if (PayReportID != undefined && DepositID != undefined) {
    var jsonData = JSON.stringify({ PayReportID: PayReportID, DepositID: DepositID });
    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: 'AssignPayReportToDeposit/AssignDepositIdToPayReport',
      data: jsonData,
      async: false,
      success: function (result) {
        success = result;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return success;
}

//--------- Tree View  UPR Functions -------- //
//Gets UnAssigned Pay Reports
AssignPayReportsToDeposit.GetUnAssignedPayReports = function () {
  var payReports;
  if (AssignPayReportsToDeposit.ValidateControls()) {
    var jsonData = JSON.stringify(
      {
        SupplierID: AssignPayReportsToDeposit.SelectedSupplierID,
        MonthPaid: AssignPayReportsToDeposit.SelectedLastMonth,
        Months: AssignPayReportsToDeposit.SelectedMonths
      });

    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "AssignPayReportToDeposit/GetUnAssignedPayReports",
      data: jsonData,
      async: false,
      success: function (data) {
        if (data != undefined && data != "")
          payReports = data;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return payReports;
}

AssignPayReportsToDeposit.BindTreeViewUPR = function () {
    var treeview = $("#TreeView_UPR");

    var inline = new kendo.data.HierarchicalDataSource({
      data: AssignPayReportsToDeposit.UnAssignedPayReportsList,
      schema: {
        model: {
          id: "PayReportID"
        }
      }
    });

    treeview.kendoTreeView({
      dragAndDrop: true,
      dataSource: inline,
      dataBound: function (e) {
        if (!this.dataSource.data().length) {
          this.element.append("<p class='no-items'>No items yet.</p>");
        } else {
          this.element.find(".no-items").remove();
        }
      },
      dataTextField: ["DisplayValue"],
      drop: AssignPayReportsToDeposit.OnTreeViewUPRDrop
    });
}

AssignPayReportsToDeposit.OnTreeViewUPRDrop = function (e) {
  var isTargetTreeViewAD = false;
  var sourceDataItem = this.dataItem(e.sourceNode);
  var targetDataItem = this.dataItem(e.destinationNode);
  if (targetDataItem == undefined) {
    targetDataItem = $("#TreeView_AD").data("kendoTreeView").dataItem(e.destinationNode);
    isTargetTreeViewAD = true;
  }

  if (sourceDataItem == undefined ||
      targetDataItem == undefined) {
    //Source and target both must exists
    e.preventDefault();
    return;
  }

  if (sourceDataItem.IsDeposit == true) {
    //Deposits cannot be drag and Drop
    e.preventDefault();
    return;
  }

  if (isTargetTreeViewAD) {
    if (e.dropPosition == "over" &&
        sourceDataItem.IsPayReport == true &&
        sourceDataItem.IsAssignedPayReport == false &&
        targetDataItem.IsDeposit == true) {
      //Source must UnAssigned Payreport Target Must be Deposit and Drop position must over 
      //Implement logic to assign deposit id to the Pay Report
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = targetDataItem.DepositID;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", true);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
  else {
    if ((e.dropPosition == "before" || e.dropPosition == "after") &&
          sourceDataItem.IsPayReport == true &&
          targetDataItem.IsPayReport == true &&
          targetDataItem.IsAssignedPayReport == false) {
      //Only allow sorting in this condition otherwise cancel drop event
      //Means only allow sorting of unassigned payreports within the tree
    }
    else {
      e.preventDefault();
      return;
    }
  }
}

AssignPayReportsToDeposit.RefreshTreeViewUPR = function () {
  //Destroy and empty tree
  var treeview = $("#TreeView_UPR").data("kendoTreeView");
  if (treeview != undefined) { treeview.destroy(); }
  treeview = $("#TreeView_UPR");
  treeview.empty();

  AssignPayReportsToDeposit.UnAssignedPayReportsList = AssignPayReportsToDeposit.GetUnAssignedPayReports();

  AssignPayReportsToDeposit.BindTreeViewUPR();
}

//--------- TreeView_AD Functions -------- //
//Gets Assigned Pay Reports
AssignPayReportsToDeposit.GetAssignedPayReports = function () {
  var payReports;
  if (AssignPayReportsToDeposit.ValidateControls()) {
    var jsonData = JSON.stringify(
      {
        SupplierID: AssignPayReportsToDeposit.SelectedSupplierID,
        MonthPaid: AssignPayReportsToDeposit.SelectedLastMonth,
        Months: AssignPayReportsToDeposit.SelectedMonths
      });

    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "AssignPayReportToDeposit/GetAssignedPayReports",
      data: jsonData,
      async: false,
      success: function (data) {
        if (data != undefined && data != "")
          payReports = data;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return payReports;
}

AssignPayReportsToDeposit.BindTreeViewAD = function () {
    var treeview = $("#TreeView_AD");

    var inline = new kendo.data.HierarchicalDataSource({
      data: AssignPayReportsToDeposit.AssignedPayReportsList,
      schema: {
        model: {
          id: "DepositID",
          hasChildren: "HasAnyAssignedPayReports",
          children: "AssignedPayReports"
        }
      }
    });

    treeview.kendoTreeView({
      dragAndDrop: true,
      dataSource: inline,
      dataBound: function (e) {
        if (!this.dataSource.data().length) {
          this.element.append("<p class='no-items'>No items yet.</p>");
        } else {
          this.element.find(".no-items").remove();
        }
      },
      dataTextField: ["DisplayValue", "DisplayValue"],
      drop: AssignPayReportsToDeposit.OnTreeViewADDrop,
      select: AssignPayReportsToDeposit.OnTreeViewADSelect
    });
}
AssignPayReportsToDeposit.OnTreeViewADSelect = function (e) {
  var dataItem = this.dataItem(e.node);
  var treeview = this;

  if (AssignPayReportsToDeposit.LastTextChangedNode != undefined) {
    //Restore last node's Text
    var previousDataItem = this.dataItem(AssignPayReportsToDeposit.LastTextChangedNode);
    if (previousDataItem != undefined) {
      var date = AssignPayReportsToDeposit.FormatDepositMonthToDisplay(previousDataItem.DepositDate);
      var displaytext = "[" + date + "]" + "-[" + previousDataItem.BankName + "]-" + "[" + previousDataItem.Amount + "]";
      this.text(AssignPayReportsToDeposit.LastTextChangedNode, displaytext);
    }
    AssignPayReportsToDeposit.LastTextChangedNode = undefined;
  }
  if (dataItem.IsDeposit) {
    if (dataItem.hasChildren > 0) {
      dataItem.set("expanded", true);
      //Append  sum to selected node's diplay value
      var childs = dataItem.children.data();
      var sum = 0;
      $.each(childs, function () { sum += this.Amount });
      var date = AssignPayReportsToDeposit.FormatDepositMonthToDisplay(dataItem.DepositDate);
      var displaytext = "[" + date + "]" + "-[" + dataItem.BankName + "]-" + "[" + dataItem.Amount + "(" + sum + ")" + "]";
      this.text(e.node, displaytext)
      AssignPayReportsToDeposit.LastTextChangedNode = e.node;
    }
  }
}

AssignPayReportsToDeposit.FormatDepositMonthToDisplay = function (jsondate) {
  var depositedate = "";
  if (jsondate != undefined && jsondate != "") {
    var date = Common.ParseDate(jsondate);
    var month = ("0" + (date.getMonth() + 1)).slice(-2);
    depositedate = date.getFullYear() + "-" + (month);
  }
  return depositedate;
}

AssignPayReportsToDeposit.OnTreeViewADDrop = function (e) {
  var isTargetTreeViewURP = false;
  var DroptoNoItemZone = false;
  var sourceDataItem = this.dataItem(e.sourceNode);
  var targetDataItem = this.dataItem(e.destinationNode);
  var treeview_UPR = $("#TreeView_UPR").data("kendoTreeView");
  if (targetDataItem == undefined) {
    targetDataItem = treeview_UPR.dataItem(e.destinationNode);
    if (treeview_UPR.element.find(".no-items").length > 0) DroptoNoItemZone = true;
    isTargetTreeViewURP = true;
  }

  if ((sourceDataItem == undefined ||
       targetDataItem == undefined) && DroptoNoItemZone == false) {
    e.preventDefault();
    return;
  }

  if (sourceDataItem.IsDeposit == true) {
    //Deposits can not be moved within the tree view
    e.preventDefault();
    return;
  }

  if (isTargetTreeViewURP) {
    if (((e.dropPosition == "before" || e.dropPosition == "after") &&
          sourceDataItem.IsPayReport == true &&
          sourceDataItem.IsAssignedPayReport == true &&
          targetDataItem.IsPayReport == true) || (e.dropPosition == "over" && DroptoNoItemZone)) {
      //Implement logic to unassing deposit id to PayReport
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = 0;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", false);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
  else {
    if (e.dropPosition == "over" &&
        sourceDataItem.IsPayReport == true &&
        targetDataItem.IsDeposit == true) {
      //Implement Logic to change deposit ID for assigned payreport
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = targetDataItem.DepositID;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", true);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
}

AssignPayReportsToDeposit.RefreshTreeViewAD = function () {
  //Destroy and empty tree
  var treeview = $("#TreeView_AD").data("kendoTreeView");
  if (treeview != undefined) { treeview.destroy(); }
  treeview = $("#TreeView_AD");
  treeview.empty();

  AssignPayReportsToDeposit.LastTextChangedNode = undefined;

  AssignPayReportsToDeposit.AssignedPayReportsList = AssignPayReportsToDeposit.GetAssignedPayReports();

  AssignPayReportsToDeposit.BindTreeViewAD();
}

函数AssignPayReportsToDeposit（）{}
AssignPayReportsToDeposit.SelectedSupplierID=0；
AssignPayReportsToDeposit.SelectedLastMonth=null；
AssignPayReportsToDeposit.SelectedMonths=0；
AssignPayReportsToDeposit.LastMonthList=null；
AssignPayReportsToDeposit.UnAssignedPayReportsList=null；
AssignPayReportsToDeposit.AssignedPayReportsList=null；
AssignPayReportsToDeposit.LastTextChangedNode=null；
//---------文件准备功能--------//
$（文档）.ready（函数（）{
//附件
AssignPayReportsToDeposit.AttachEvents（）；
});
AssignPayReportsToDeposit.AttachEvents=函数（）{
美元（“#DDS供应商”）.变更（将付款报告转让给Deposit.on供应商变更）；
美元（“#dLastMonth”）.change（将PayReportsToDeposit.OnLastMonthChange赋值）；
美元（“#txtmounts”）.change（将PayReports分配给Deposit.OnMonthsChange）；
}
//处理供应商变更事件
AssignPayReportsToDeposit.OnSupplierChange=函数（）{
//更改供应商ID
AssignPayReportsToDeposit.SelectedSupplierID=$（“#ddSupplier”）.val（）；
//获取上月列表
AssignPayReportsToDeposit.LastMonthList=CommonAction.GetLastPayReportMonthBySupplierId（AssignPayReportsToDeposit.SelectedSupplierID）；
//填写上月清单
将PayReportsToDeposit.FillLastMonths（）赋值；
//刷新树视图
AssignPayReportsToDeposit.RefreshTreeViewWupr（）；
//刷新TreeView_广告
将PayReportsToDeposit.RefreshTreeWad（）赋值；
}
//处理上月的更改事件
AssignPayReportsToDeposit.OnLastMonthChange=函数（）{
AssignPayReportsToDeposit.SelectedLastMonth=$（“#DlastMonth”）.val（）；
//刷新树视图
AssignPayReportsToDeposit.RefreshTreeViewWupr（）；
//刷新TreeView_广告
将PayReportsToDeposit.RefreshTreeWad（）赋值；
}
//处理月份更改事件
AssignPayReportsToDeposit.OnMonthsChange=函数（）{
AssignPayReportsToDeposit.SelectedMonths=$（“#txtMonths”）.val（）；
//刷新树视图
AssignPayReportsToDeposit.RefreshTreeViewWupr（）；
//刷新TreeView_广告
将PayReportsToDeposit.RefreshTreeWad（）赋值；
}
//用选项填充上个月下拉列表
AssignPayReportsToDeposit.FillLastMonths=函数（）{
var DlastMonth=$（“#DlastMonth”）；
如果（DlastMonth！=未定义）{
ddlastmount.empty（）；
如果（AssignPayReportsToDeposit.LastMonthList！=未定义

function AssignPayReportsToDeposit() { }

AssignPayReportsToDeposit.SelectedSupplierID = 0;
AssignPayReportsToDeposit.SelectedLastMonth = null;
AssignPayReportsToDeposit.SelectedMonths = 0;

AssignPayReportsToDeposit.LastMonthsList = null;
AssignPayReportsToDeposit.UnAssignedPayReportsList = null;
AssignPayReportsToDeposit.AssignedPayReportsList = null;

AssignPayReportsToDeposit.LastTextChangedNode = null;
//--------- Document Ready Function -------- //
$(document).ready(function () {

  //AttachEvents
  AssignPayReportsToDeposit.AttachEvents();
});

AssignPayReportsToDeposit.AttachEvents = function () {
  $("#ddSupplier").change(AssignPayReportsToDeposit.OnSupplierChange);
  $("#ddLastMonth").change(AssignPayReportsToDeposit.OnLastMonthChange);
  $("#txtMonths").change(AssignPayReportsToDeposit.OnMonthsChange);
}

//Handles Supplier ChangeEvents
AssignPayReportsToDeposit.OnSupplierChange = function () {
  //Get Changed Supplier ID
  AssignPayReportsToDeposit.SelectedSupplierID = $('#ddSupplier').val();
  //Get Last Month List
  AssignPayReportsToDeposit.LastMonthsList = CommonAction.GetLastPayReportMonthsBySupplierID(AssignPayReportsToDeposit.SelectedSupplierID);
  //Fill Last Month List
  AssignPayReportsToDeposit.FillLastMonths();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Handles Last Month Change Event
AssignPayReportsToDeposit.OnLastMonthChange = function () {
  AssignPayReportsToDeposit.SelectedLastMonth = $('#ddLastMonth').val();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Handles Month Change Event
AssignPayReportsToDeposit.OnMonthsChange = function () {
  AssignPayReportsToDeposit.SelectedMonths = $('#txtMonths').val();
  //Refresh TreeView_UPR
  AssignPayReportsToDeposit.RefreshTreeViewUPR();
  //Refresh TreeView_AD
  AssignPayReportsToDeposit.RefreshTreeViewAD();
}

//Fills Last Month Dropdown with options
AssignPayReportsToDeposit.FillLastMonths = function () {
  var ddLastMonth = $("#ddLastMonth");
  if (ddLastMonth != undefined) {
    ddLastMonth.empty();
    if (AssignPayReportsToDeposit.LastMonthsList != undefined) {
      $.each(AssignPayReportsToDeposit.LastMonthsList, function () {
        Common.AddOptionToSelect(ddLastMonth, this.Text, this.Text);
      });
      ddLastMonth.val(AssignPayReportsToDeposit.LastMonthsList[0].Text);
      AssignPayReportsToDeposit.SelectedLastMonth = ddLastMonth.val();
    }
  }
}

AssignPayReportsToDeposit.ValidateControls = function () {
  var success = true;
  if (AssignPayReportsToDeposit.SelectedSupplierID == undefined ||
      AssignPayReportsToDeposit.SelectedSupplierID == 0) {
    //  bootbox.alert('Please select a Supplier');
    success = false;
  }
  else if (AssignPayReportsToDeposit.SelectedLastMonth == undefined ||
          AssignPayReportsToDeposit.SelectedLastMonth == '') {
    //   bootbox.alert('Please select Last Month');
    success = false;
  }
  else if (AssignPayReportsToDeposit.SelectedMonths == undefined ||
          AssignPayReportsToDeposit.SelectedMonths == 0) {
    //  bootbox.alert('Please Enter Months');
    success = false;
  }
  return success;
}

//Assigns DepositIdToPayReport
AssignPayReportsToDeposit.AssignDepositIdToPayReport = function (PayReportID, DepositID) {
  var success = false;
  if (PayReportID != undefined && DepositID != undefined) {
    var jsonData = JSON.stringify({ PayReportID: PayReportID, DepositID: DepositID });
    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: 'AssignPayReportToDeposit/AssignDepositIdToPayReport',
      data: jsonData,
      async: false,
      success: function (result) {
        success = result;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return success;
}

//--------- Tree View  UPR Functions -------- //
//Gets UnAssigned Pay Reports
AssignPayReportsToDeposit.GetUnAssignedPayReports = function () {
  var payReports;
  if (AssignPayReportsToDeposit.ValidateControls()) {
    var jsonData = JSON.stringify(
      {
        SupplierID: AssignPayReportsToDeposit.SelectedSupplierID,
        MonthPaid: AssignPayReportsToDeposit.SelectedLastMonth,
        Months: AssignPayReportsToDeposit.SelectedMonths
      });

    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "AssignPayReportToDeposit/GetUnAssignedPayReports",
      data: jsonData,
      async: false,
      success: function (data) {
        if (data != undefined && data != "")
          payReports = data;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return payReports;
}

AssignPayReportsToDeposit.BindTreeViewUPR = function () {
    var treeview = $("#TreeView_UPR");

    var inline = new kendo.data.HierarchicalDataSource({
      data: AssignPayReportsToDeposit.UnAssignedPayReportsList,
      schema: {
        model: {
          id: "PayReportID"
        }
      }
    });

    treeview.kendoTreeView({
      dragAndDrop: true,
      dataSource: inline,
      dataBound: function (e) {
        if (!this.dataSource.data().length) {
          this.element.append("<p class='no-items'>No items yet.</p>");
        } else {
          this.element.find(".no-items").remove();
        }
      },
      dataTextField: ["DisplayValue"],
      drop: AssignPayReportsToDeposit.OnTreeViewUPRDrop
    });
}

AssignPayReportsToDeposit.OnTreeViewUPRDrop = function (e) {
  var isTargetTreeViewAD = false;
  var sourceDataItem = this.dataItem(e.sourceNode);
  var targetDataItem = this.dataItem(e.destinationNode);
  if (targetDataItem == undefined) {
    targetDataItem = $("#TreeView_AD").data("kendoTreeView").dataItem(e.destinationNode);
    isTargetTreeViewAD = true;
  }

  if (sourceDataItem == undefined ||
      targetDataItem == undefined) {
    //Source and target both must exists
    e.preventDefault();
    return;
  }

  if (sourceDataItem.IsDeposit == true) {
    //Deposits cannot be drag and Drop
    e.preventDefault();
    return;
  }

  if (isTargetTreeViewAD) {
    if (e.dropPosition == "over" &&
        sourceDataItem.IsPayReport == true &&
        sourceDataItem.IsAssignedPayReport == false &&
        targetDataItem.IsDeposit == true) {
      //Source must UnAssigned Payreport Target Must be Deposit and Drop position must over 
      //Implement logic to assign deposit id to the Pay Report
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = targetDataItem.DepositID;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", true);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
  else {
    if ((e.dropPosition == "before" || e.dropPosition == "after") &&
          sourceDataItem.IsPayReport == true &&
          targetDataItem.IsPayReport == true &&
          targetDataItem.IsAssignedPayReport == false) {
      //Only allow sorting in this condition otherwise cancel drop event
      //Means only allow sorting of unassigned payreports within the tree
    }
    else {
      e.preventDefault();
      return;
    }
  }
}

AssignPayReportsToDeposit.RefreshTreeViewUPR = function () {
  //Destroy and empty tree
  var treeview = $("#TreeView_UPR").data("kendoTreeView");
  if (treeview != undefined) { treeview.destroy(); }
  treeview = $("#TreeView_UPR");
  treeview.empty();

  AssignPayReportsToDeposit.UnAssignedPayReportsList = AssignPayReportsToDeposit.GetUnAssignedPayReports();

  AssignPayReportsToDeposit.BindTreeViewUPR();
}

//--------- TreeView_AD Functions -------- //
//Gets Assigned Pay Reports
AssignPayReportsToDeposit.GetAssignedPayReports = function () {
  var payReports;
  if (AssignPayReportsToDeposit.ValidateControls()) {
    var jsonData = JSON.stringify(
      {
        SupplierID: AssignPayReportsToDeposit.SelectedSupplierID,
        MonthPaid: AssignPayReportsToDeposit.SelectedLastMonth,
        Months: AssignPayReportsToDeposit.SelectedMonths
      });

    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "AssignPayReportToDeposit/GetAssignedPayReports",
      data: jsonData,
      async: false,
      success: function (data) {
        if (data != undefined && data != "")
          payReports = data;
      },
      error: Common.AjaxErrorHandler
    });
  }
  return payReports;
}

AssignPayReportsToDeposit.BindTreeViewAD = function () {
    var treeview = $("#TreeView_AD");

    var inline = new kendo.data.HierarchicalDataSource({
      data: AssignPayReportsToDeposit.AssignedPayReportsList,
      schema: {
        model: {
          id: "DepositID",
          hasChildren: "HasAnyAssignedPayReports",
          children: "AssignedPayReports"
        }
      }
    });

    treeview.kendoTreeView({
      dragAndDrop: true,
      dataSource: inline,
      dataBound: function (e) {
        if (!this.dataSource.data().length) {
          this.element.append("<p class='no-items'>No items yet.</p>");
        } else {
          this.element.find(".no-items").remove();
        }
      },
      dataTextField: ["DisplayValue", "DisplayValue"],
      drop: AssignPayReportsToDeposit.OnTreeViewADDrop,
      select: AssignPayReportsToDeposit.OnTreeViewADSelect
    });
}
AssignPayReportsToDeposit.OnTreeViewADSelect = function (e) {
  var dataItem = this.dataItem(e.node);
  var treeview = this;

  if (AssignPayReportsToDeposit.LastTextChangedNode != undefined) {
    //Restore last node's Text
    var previousDataItem = this.dataItem(AssignPayReportsToDeposit.LastTextChangedNode);
    if (previousDataItem != undefined) {
      var date = AssignPayReportsToDeposit.FormatDepositMonthToDisplay(previousDataItem.DepositDate);
      var displaytext = "[" + date + "]" + "-[" + previousDataItem.BankName + "]-" + "[" + previousDataItem.Amount + "]";
      this.text(AssignPayReportsToDeposit.LastTextChangedNode, displaytext);
    }
    AssignPayReportsToDeposit.LastTextChangedNode = undefined;
  }
  if (dataItem.IsDeposit) {
    if (dataItem.hasChildren > 0) {
      dataItem.set("expanded", true);
      //Append  sum to selected node's diplay value
      var childs = dataItem.children.data();
      var sum = 0;
      $.each(childs, function () { sum += this.Amount });
      var date = AssignPayReportsToDeposit.FormatDepositMonthToDisplay(dataItem.DepositDate);
      var displaytext = "[" + date + "]" + "-[" + dataItem.BankName + "]-" + "[" + dataItem.Amount + "(" + sum + ")" + "]";
      this.text(e.node, displaytext)
      AssignPayReportsToDeposit.LastTextChangedNode = e.node;
    }
  }
}

AssignPayReportsToDeposit.FormatDepositMonthToDisplay = function (jsondate) {
  var depositedate = "";
  if (jsondate != undefined && jsondate != "") {
    var date = Common.ParseDate(jsondate);
    var month = ("0" + (date.getMonth() + 1)).slice(-2);
    depositedate = date.getFullYear() + "-" + (month);
  }
  return depositedate;
}

AssignPayReportsToDeposit.OnTreeViewADDrop = function (e) {
  var isTargetTreeViewURP = false;
  var DroptoNoItemZone = false;
  var sourceDataItem = this.dataItem(e.sourceNode);
  var targetDataItem = this.dataItem(e.destinationNode);
  var treeview_UPR = $("#TreeView_UPR").data("kendoTreeView");
  if (targetDataItem == undefined) {
    targetDataItem = treeview_UPR.dataItem(e.destinationNode);
    if (treeview_UPR.element.find(".no-items").length > 0) DroptoNoItemZone = true;
    isTargetTreeViewURP = true;
  }

  if ((sourceDataItem == undefined ||
       targetDataItem == undefined) && DroptoNoItemZone == false) {
    e.preventDefault();
    return;
  }

  if (sourceDataItem.IsDeposit == true) {
    //Deposits can not be moved within the tree view
    e.preventDefault();
    return;
  }

  if (isTargetTreeViewURP) {
    if (((e.dropPosition == "before" || e.dropPosition == "after") &&
          sourceDataItem.IsPayReport == true &&
          sourceDataItem.IsAssignedPayReport == true &&
          targetDataItem.IsPayReport == true) || (e.dropPosition == "over" && DroptoNoItemZone)) {
      //Implement logic to unassing deposit id to PayReport
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = 0;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", false);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
  else {
    if (e.dropPosition == "over" &&
        sourceDataItem.IsPayReport == true &&
        targetDataItem.IsDeposit == true) {
      //Implement Logic to change deposit ID for assigned payreport
      var PayReportID = sourceDataItem.PayReportID;
      var DepositID = targetDataItem.DepositID;
      if (AssignPayReportsToDeposit.AssignDepositIdToPayReport(PayReportID, DepositID)) {
        sourceDataItem.set("DepositID", DepositID);
        sourceDataItem.set("IsAssignedPayReport", true);
      }
      else {
        //Didnt update the record don't do the drop
        e.preventDefault();
        return;
      }
    }
    else {
      e.preventDefault();
      return;
    }
  }
}

AssignPayReportsToDeposit.RefreshTreeViewAD = function () {
  //Destroy and empty tree
  var treeview = $("#TreeView_AD").data("kendoTreeView");
  if (treeview != undefined) { treeview.destroy(); }
  treeview = $("#TreeView_AD");
  treeview.empty();

  AssignPayReportsToDeposit.LastTextChangedNode = undefined;

  AssignPayReportsToDeposit.AssignedPayReportsList = AssignPayReportsToDeposit.GetAssignedPayReports();

  AssignPayReportsToDeposit.BindTreeViewAD();
}