Question

我想通过javascript得到一个面板名称，这是扩展。我正在通过@ item.Name动态显示一个面板列表。当我展开其中任何一个时，我试图通过... var panelId获得扩展的面板名称= $（“＃collapse”）。attr（“name”）; 但我只获得了小组的第一名。

首先，我想说我想通过ajax将控制文件发送到带有扩展面板面板名称参数的控制器。现在我想将面板名称转换为sumit函数，然后传递给控制器。

索引

 <div class="panel panel-info class" style="height: 450px; width: 300px; overflow-y:scroll;">
       @foreach (var item in lstCategory)
       {
            <div class="panel-heading" id="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" onclick="collapse(@item.Id);" name="@item.Name"  id="collapse" href="#@item.Id">@item.Name</a>                     
                </h4>
            </div>

       <div id="@item.Id" class="panel-collapse collapse in">
           <div id="file_@item.Id">
           </div>
        </div>

       }      
</div>
<form id="form" name="form" enctype="multipart/form-data" method="post">
            @*<label class="btn btn-block btn-primary">
                Browse &hellip; <input type="file" name="file" class="filestyle" id="file" style="display: none;" />
            </label>*@
            <span class="btn btn-default btn-file" id="browse"style="width:100%;">
                <input type="file" name="file" class="filestyle" id="file"  />
             @*<input type="file">*@
            </span>
            <input type="submit" name="Submit" class="btn" id="Submit" value="Submit" style="width:100%;margin-top:5px;" disabled>
        </form>

的javascript

  var panelId = $("#collapse").attr("name");
        alert("Panel name :" + panelId);


   $(document).ready(function (e) {
    $('#Submit').click(function (event) {


        var file = $("file").data();
        var panelId = $("#collapse").attr("name");
        alert("Panel name :" + panelId);
        var formData = new FormData();
        var totalFiles = document.getElementById("file").files.length;
        for (var i = 0; i < totalFiles; i++) {
            var file = document.getElementById("file").files[i];

            formData.append("file", file);
        }
        alert(file);
            $.ajax(
       {
           url: '@Url.Action("Upload","Document")',
           type: "POST",
           data: { file: formData, Id: panelId },//{ file: formData, value: dam },//formData,
           processData: false,
           contentType: false,
           success: function (response) {
                 console.log(response);
           },
           error: function (error) {
               console.log(error);
           },

       });
    })
});

Answer 1

你真的想要小组的名字吗？

您可以使用此与折叠功能的参数进行操作，例如：

onclick="collapse(this);"

因此，您可以访问父div。

对不起，但你的问题对我来说不是很清楚，因为我不明白你需要做什么。

如果您能解释一下，我们很乐意为您提供帮助。

更新

因此，请尝试使用此代码：

$(document).ready(function(){

    //I am moving your click to JQuery
    $("#collapse").click(function(){

        //Clear last selected item
        $("#collapse").each(function(){
            $(this).attr("data-selected", "");
         });

        //Mark the actual as selected
        $(this).attr("data-selected", "yes");
    });

    //Now, update your actual submit to get the actual selected item
    $('#Submit').click(function (event) {
       var nameSelected = $("#collapse[data-selected=yes]").eq(0).attr("name");

       //rest of your code here...
    });

});

Answer 2

您可以使用 $（this）来获取有效标记的名称。或者你可以在函数中传递名称而不是id ：onclick =“collapse（@ item.name）;”

function collapse()
{
    var itemName=$(this).attr("name")
}

如何通过javascript获取面板名称？

2 个答案: