Question

好吧基本上我有一个列，当你点击标题时，会动态显示几个输入标记，以更改列名并提交它。我想改变它并使用ajax立即显示它。执行此操作的代码如下，对不起，但代码是咖啡脚本。我也在使用ASPNET5 RC1和MVC6。

SumbitColumnForm = () ->
$('.panel-heading').on 'click', 'input.ColumnTitleSumbit', (event) ->
    event.preventDefault();

    columnName = $('.NewColumnName').val().trim()
    columnNumber = $(this).parent().parent().attr 'id'

    newColumnData = "{ 
        'ColumnName': 'columnName'
        'ColumnNumber': 'columnNumber'
    }"      

    $.ajax
        url: '/Board/ChangeColumnName',
        type: 'POST'
        dataType: 'json',
        data: newColumnData,
        success: (data) -> 
                #res = $.parseJSON(data);
                alert "Hit the Success part";

        error: (xhr, err) ->
            alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
            alert("responseText: " + xhr.responseText);

控制器操作

  [Route("{p_BoardName}")]
    public IActionResult Show(string p_BoardName)
    {
        m_Board.BoardName = p_BoardName;
        ViewData["BoardName"] = m_Board.BoardName;
        return View(m_Board);
    }

    [HttpPost]
    public IActionResult ChangeColumnName(ColumnModel newColumnData)
    {
        string name = newColumnData.ColumnName;
        m_Board.ColumnList[newColumnData.ColumnNumber].ColumnName = name;
        return View("Show", m_Board);
    }

如果需要还可以使用modelS

public class ColumnModel
{
    private string m_name;
    private int m_columnNumber;

    public int ColumnNumber { get { return m_columnNumber; } }
    public string ColumnName { get { return m_name;} set { m_name = value; } }

    public ColumnModel(string p_Name, int p_ColumnNumber)
    {
        m_name = p_Name;
        m_columnNumber = p_ColumnNumber;
    }
}


public class BoardModel
{
    private string m_BoardName;
    private List<ColumnModel> m_ColumnList;


    [Required]
    public string BoardName { get { return m_BoardName; } set { m_BoardName = value; } }

    public List<ColumnModel> ColumnList
    {
        get { return m_ColumnList; }
        set { m_ColumnList = value; }
    }

}

所以我调试了Javascript和控制器操作ChangeColumnName，但它没有打到它。 javascript也没有达到ajax调用的成功部分。我已经尝试了所有想到的东西并完成了大量的谷歌搜索，但它只是赢得了工作。我觉得这是因为我发送$ .ajax电话的数据的方式，但我真的不知道为什么这不起作用。

此外，如果我想更新列名，通过删除输入并添加普通HTML来显示名称，我是否正确返回操作方法ChangeColumnName中的视图？我的意思是它会重新加载页面或动态添加它。我是否必须在$ .ajax调用的success属性中添加JS代码才能动态更改它？

任何帮助将不胜感激。谢谢。

编辑：添加了电路板模型

Edit2：更新显示html代码作为Stephen的请求。

使用bootstrap列/网格设计，以及引导面板。我基本上有html显示的列

<div id="1" class="panel panel-default BoardColumn">
   <div class="panel-heading">
    <h3 class="panel-title">Something1</h3>
   </div>
 </div>

我想更改标题类＆＃39; panel-title＆＃39;并动态更新它而不重新加载页面。我已经设置了另一个ajax调用，所以当单击标题时，会添加一些输入标记，并且html将更改为以下内容。在最小的解释中我使用jquery追加和删除函数完成了这个。

   <div id="1" class="panel panel-default BoardColumn">
       <div class="panel-heading">
         <input class="PreviousColumnName" type="hidden" style="display: none;" value="Something1">
        <input class="NewColumnName" name="ColumnName">
       <input class="ColumnTitleSumbit" type="submit" value="Continue">
    </div>
  </div>

现在我想获取带有类名＆＃39; NewcolumnName＆＃39;的输入值，更新模型中的当前列名并放置其新名称。单击提交按钮时，我想删除输入标记并在此之前返回原始html，显示新的列名而不重新加载。

使用$ .ajax通过aspnet5中的HttpPost发送数据不起作用

0 个答案: