Question

我正在使用asp.net。我正在使用图像。我的代码示例如下：

 { <div style="float: left; width: 30%; padding-left: 3px;">
                <asp:Label ID="ImageTitleLabel" runat="server" Text="Image Title"></asp:Label>
            </div>
            <div style="float: left; width: 60%;">
                <asp:TextBox ID="ImageTitleTextBox" runat="server" MaxLength="50" CssClass="smallTxtBox"></asp:TextBox>
            </div>
            <div class="formlinebreak">
            </div>
            <div style="float: left; width: 30%; padding-left: 3px;">
                <asp:Label ID="ImageDescriptionLabel" runat="server" Text="Image Description"></asp:Label>
            </div>
            <div style="float: left; width: 60%;">
                <asp:TextBox ID="ImageDescriptionTextBox" runat="server" MaxLength="256" TextMode="MultiLine"
                    CssClass="multilineTxtBox"></asp:TextBox>
            </div>
            <div class="formlinebreak">
            </div>
            <div id="PhotoTransport" style="float: left; width: 29.5%; padding-left: 5px;">
                <img id="imgEventPhoto" width="120" height="90" class="IntGalHLNoBrdr" alt='Sorry! No image found.'
                    src='' runat="server" />
            </div>
            <%--divPhotoUpload starts--%>
            <div id="divPhotoUpload" style="float: left; width: 65%;">
                <input id="fupEventPhoto" type="file" size="35" name="PhotoUploadedToUpload" class="imguploader validate[required]"
                    onchange="return validatePhotographToUploadPhoto();" />

                <img id="PhotoLoading" alt="Loading..." src="<%=ResolveClientUrl("~/Images/loading.gif")%>"
                    style="display: none;" />
            </div>
            <%--  divPhotoUpload end--%>
            <%--divPhotoThumb starts--%>
            <div id="divPhotoThumb" style="font-size: 10px; float: left;">
                <asp:Button ID="btnClearPhoto" runat="server" Text="Clear Image" CssClass="CCButtonEnabled" 
                    OnClick="btnClearPhoto_Click" />
            </div>
            <%--  divPhotoThumb end--%>
            <div class="formlinebreak">
            </div>
            <div id="ButtonFields" style="float:right;">  
                <asp:Button ID="CancelButton" runat="server" CssClass="CCButtonEnabled" Text="Cancel"
                    OnClick="CancelButton_Click" UseSubmitBehavior="false" />
                     <asp:Button ID="SaveButton" runat="server" CssClass="CCButtonEnabled" Text="Save" OnClick="SaveButton_Click" />
                    <asp:Button ID="EditButton" runat="server" CssClass="CCButtonEnabled" Text=" Edit" OnClick="EditButton_Click" />
                      <asp:Button ID="AddButton" runat="server" CssClass="CCButtonEnabled" Text=" Add" OnClick="AddButton_Click" />
            </div>}

我正在尝试在保存按钮的点击事件中验证图像标题。我试图在浏览选项和清除图像按钮之间切换。我正在使用jquery在它们之间切换。在其他形式它工作正常，但在这个页面中相同的代码片段不起作用。要切换我有这样的代码：

 {function ShowThumbPhoto() {

        // $('[id$=imgEventPhoto]').attr('src','<%=ResolveClientUrl("~/jj.jpg") %>');
        $('[id$=imgEventPhoto]').attr('src', '<%=ResolveClientUrl("~/Handlers/DisplayCropedThumbImage.ashx?")%>TY=P&cropImageW=' + $('[id$=cropImageW]').val() + '&cropImageH=' + $('[id$=cropImageH]').val() + '&cropImageX1=' + $('[id$=cropImageX1]').val() + ' &cropImageY1=' + $('[id$=cropImageY1]').val() + ' &T=' + new Date().getTime().toString());
        $('#divPhotoThumb').show();
        $('[#divPhotoUpload').hide();


    };
    function HideThumbPhoto() {            
        $('[id$=divPhotoThumb]').hide();
        $('[id$=divPhotoUpload]').show();
        $('[id$=btnClearPhoto]').hide();

    };}

现在我正在尝试在文档中的保存按钮中验证图像标题。准备像这样的jquery：

 {  $(document).ready(function () {

        $("#aspnetForm").validate({  //Imp #aspnetForm is the ID of the <form> in site.Master
            rules: {
                '<%=ImageTitleTextBox.UniqueID %>': {
                    required: true
                },
                PhotoUploadedToUpload: {
                    required: true
                }
            },
            messages: {
                '<%=ImageTitleTextBox.UniqueID %>': {
                    required: "<span  style='color:#F87126;padding-left:10px; font-size:smaller;'>Image title  is required.</span>"
                },
                PhotoUploadedToUpload: {
                    required: "<span  style='color:#F87126;margin-left:60px;font-size:smaller;width:50px;'>Please select an image.</span>"
                }
            }

        });}

我试图解决验证，因为最近两天但是无法解决，我正在服务器端从clearImageButton_Click（）中调用HideThumbPhoto（），如下所示：

 { protected void btnCancelPhoto_Click(object sender, EventArgs e)
    {
        Session["ucPhotoUploaderUploadedImagePhoto"] = null;
        this.RegisterJS("tabClick($('a[href=#tabInstancePhotoGallery]').parent());");
        CheckImage();
    }

     private void CheckImage()
    {
        if (Session["ucPhotoUploaderUploadedImagePhoto"] != null)
        {
            this.RegisterJS("ShowThumbPhoto();");

        }
        else
        {
            this.RegisterJS("HideThumbPhoto();");

        }
    }


      }

我的问题如下：

想要在“保存”按钮单击中验证标题，但此处在验证中正在ClearImage中执行单击。
我想通过ShowThumbPhoto和hideThumbPhoto fn在浏览和清除图像之间切换。

Answer 1

使用 <%=ImageTitleTextBox.ClientID %> 而不是 <%=ImageTitleTextBox.UniqueID %>

同样在JS函数中： -

{function ShowThumbPhoto() { // $('[id$=imgEventPhoto]').attr('src','<%=ResolveClientUrl("~/jj.jpg") %>'); $('[id$=imgEventPhoto]').attr('src', '<%=ResolveClientUrl("~/Handlers/DisplayCropedThumbImage.ashx?")%>TY=P&cropImageW=' + $('[id$=cropImageW]').val() + '&cropImageH=' + $('[id$=cropImageH]').val() + '&cropImageX1=' + $('[id$=cropImageX1]').val() + ' &cropImageY1=' + $('[id$=cropImageY1]').val() + ' &T=' + new Date().getTime().toString()); $('#divPhotoThumb').show(); //$('[#divPhotoUpload').hide(); $('#divPhotoUpload').hide(); }; function HideThumbPhoto() { $('[id$=divPhotoThumb]').hide(); $('[id$=divPhotoUpload]').show(); $('[id$=btnClearPhoto]').hide(); };}

文本框和图像的jQuery验证无法正常工作

1 个答案: