使用html控件中的参数调用函数

时间:2018-03-28 04:26:08

标签: c# function image-gallery

我在div.InnerHtml中添加一些html / css,通过应用foreach循环读取每个目录内容来发布图像,我想将函数showfile(动态参数)调用到其中。 我该怎么办? showfiles(动态参数)函数工作正常,但是我希望在用户点击div中生成的控件之后使其工作,这不起作用,请查看我的代码并给我建议。

 public void Showimages( string fname)
        {
            string name = Path.GetFileName(fname);                                        //select only name.ext
            str2 = "<div style='max-width:250px; max-height:170px;'>"
                + "<a href ='" + filepath2 + "/" + name + "' >"
                  + "<img class='img-responsive' src='" + filepath2 + "/" + name + "'>"+name+"</a></div>";          //post image + name in loop
            imgcontainer.InnerHtml += str2;
        }
        public void Generatecontrol(string dp)
        {      
            //linkdiv.InnerHtml += "<asp:LinkButton runat='server' class='linkb' OnClick='Showfiles(" + dp.ToString()+ ")' >" + dp.ToString() + "</asp:LinkButton><br />";
            linkdiv.InnerHtml += "<span class='col-lg-4'><asp:LinkButton runat='server' class='col-lg-4 linkb' OnClick='Showfiles' CommandArgument=" + dp.ToString()+ " ><img src='/pimages/folder.jpg' height='75' width='75' border='0'/><br />" + dp.ToString() + "<br /></asp:LinkButton></span>";
        }

2 个答案:

答案 0 :(得分:0)

看到您将值传递为CommandArgument,因此您必须从CommandArgument中获取相同内容。更改Showimages的签名,如下所示:

public void Showimages(object sender, CommandEventArgs e)
{
    string name = Path.GetFileName(e.CommandArgument.ToString());  
    // your code here
}

答案 1 :(得分:0)

Pritesh, 如果您的主要关注点是仅动态显示图像,那么您可以使用jquery,下面我准备了一个小片段,请看一下,

后端代码:

    public List<string> GetImages()
    {
        string fileName = "";
        string[] files = System.IO.Directory.GetFiles("");
        List<string> listImages = new List<string>();
        foreach (string file in files)
        {
            fileName = System.IO.Path.GetFileName(file);
            listImages.Add(fileName);
        }
        return listImages;
    }

<强> HTML:

   <div class="row" style="margin-top:20px;">
       <div id="imgPreview"></div>
   </div>
   <button id="btnShowImage" onclick="ShowImages()">Show Image</button>

<强> Jquery的

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
     function ShowImages() {
        $("#imgPreview").html("");
        $.ajax({
            type: 'post',
            url: '/xyz/GetImages',
            data: formData,
            success: function (response) {
                if (response != null) {
                    var imageList =DisplayImages(response);
                    $("#imgPreview").append(imageList);
                }
            },
            processData: false,
            contentType: false,
            error: function () {
                alert("Whoops something went wrong!");
            }
        });
    }
    )};
    function DisplayImages(data) {
    var imageDiv ="";
    if (data != null) {
        $.each(data, function (index, value) {
            //This is for dynamically generating image div. You can manipulate this section as per you need.
            imageDiv = "<div style='max-width:250px; max-height:170px;'>";
            imageDiv += "<a href ='~/your static path/" + value + "' >";
            imageDiv += "<img class='img-responsive' src='='~/your static path/" + value + "'>" + value + "</a></div>";
        });
    }
    return imageDiv;
}
</script>

如果有帮助,请告诉我。