How to display message on label using jquery on href link click?

Question

1.00/5 (1 vote)

See more:

Hello,

I am writing this code for image display on href link click but i need a different text according to href link.
My code is:-

<script type="text/javascript">

	    var theInt = null;
	    var $crosslink, $navthumb;
	    var curclicked = 0;

	    theInterval = function (cur) {
	        clearInterval(theInt);

	        if (typeof cur != 'undefined')
	            curclicked = cur;

	        $crosslink.removeClass("active-thumb");
	        $navthumb.eq(curclicked).parent().addClass("active-thumb");
	        $(".stripNav ul li a").eq(curclicked).trigger('click');

	        theInt = setInterval(function () {
	            $crosslink.removeClass("active-thumb");
	            $navthumb.eq(curclicked).parent().addClass("active-thumb");
	            $(".stripNav ul li a").eq(curclicked).trigger('click');
	            curclicked++;
	            if (6 == curclicked)
	                curclicked = 0;

	        }, 200000);
	    };

	    $(function () {

	        $("#main-photo-slider").codaSlider();

	        $navthumb = $(".nav-thumb");
	        $crosslink = $(".cross-link");
	        $navthumb
			.click(function () {
			    var $this = $(this);
			    theInterval($this.parent().attr('href').slice(1) - 1);

			    return false;

			});

	        theInterval();
	    });
	</script>

<div class="slider-wrap">

		<div id="main-photo-slider" class="csw">
			<div class="panelContainer">
           
				<div class="panel" title="Panel 1">
					<div class="wrapper">
                  <div class="box-image">
                                                            <div class="inner-image" style="margin-removed30px;"> 
                                                             <asp:Image ID="uploadImage" runat="server" Width="823" Height="450" style="margin:50px 0 200px 0; position:relative; z-index:0; border:none;"/>
                                                             <asp:Image ID="bg1" runat="server" width="890" ImageUrl="images/bgeventimage.png" borderStyle=None CssClass="floatLeft" height="530" style="margin: -680px 0 0 -30px;" />
                                                           
                                                            </div>
                                                            
                                                            

                                                            <div>
                                                           
                                                             <div>
                                                           
                                                           </div>
                                                            <img src="images/bgeventimage34.png" width="890" height="510" alt="" style="margin:30px 0 0 -890px; position:absolute;" />
                                                             
                                                        </div>
 
                                                    </div>
                                                     
					</div>
                                                            <asp:TextBox ID="Template1TxtTo" runat="server" CssClass="sample-text-01" placeholder="To...">
                                                            <asp:TextBox ID="Template1TxtFrom" runat="server" CssClass="sample-text-02" placeholder="from...">
                                                            
				</div>
				
                <div class="panel" title="Panel 2">
					<div class="wrapper">
                  <div class="box-image">
                                                            <div class="inner-image" style="margin-removed30px;"> 
                                                             <asp:Image ID="Image1" runat="server" Width="823" Height="450" style="margin:50px 0 200px 0; position:relative; z-index:0; border:none;"/>
                                                             <asp:Image ID="Image2" runat="server" width="890" ImageUrl="images/bgeventimage.png" borderStyle=None CssClass="floatLeft" height="530" style="margin: -680px 0 0 -30px;" />
                                                           
                                                            </div>
                                                            
                                                            

                                                            <div>
                                                             <div>

                                                           </div>
                                                            <img src="images/bgeventimage35.png" width="890" height="510" alt="" style="margin:30px 0 0 -890px; position:absolute;" />
                                                             
                                                        </div>

                                                        <%--<img src="images/bgeventimage33.png" width="890" height="510" alt="scotch egg" style="margin: 0 0 0 0;"
                                                            class="floatLeft" />--%>


                                                        
                                                    </div>
                                                     
					</div>
                                                            <asp:TextBox ID="TextBox3" runat="server" CssClass="sample-text-03" placeholder="To...">
                                                            <asp:TextBox ID="TextBox4" runat="server" CssClass="sample-text-04" placeholder="from...">
				</div>
</div>
		</div>
<div id="movers-row">
        	<div>
            <a href="#1" class="cross-link">
            <img src="images/thumbimage.jpg" width="150" height="100" class="nav-thumb" alt="temp-thumb" />
           </a></div>
			<div><a href="#2" class="cross-link"><img src="images/thumbimage2.jpg" width="150" height="100" class="nav-thumb" alt="temp-thumb" /></a>
            </div>
</div>
<asp:Label ID="lblTempolateTextInformation" runat="server" Text="">

I want to display text on "lblTempolateTextInformation" according to first tenplate and second template click both information are different.
How it can be possible from jquery.

Please help me.

Thanks in Advance

Ankit Agarwal
Website Developer

Posted 22-Dec-13 22:31pm

ankit.agg1984

Updated 22-Dec-13 22:48pm

JoCodes

v4

Add a Solution

Comments

Er. Tushar Srivastava 23-Dec-13 4:46am

You have dumped your whole code without any formatting. Please consider revising it using Improve Question Link and put the codes in the Code or Pre Tag. Also, add your observed and expected response. It will help others while reading the question :)

[no name] 23-Dec-13 4:47am

I write whole code but did not accept div tag,
how can we put my question in codeproject?

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Jain Nishant · Answer 1 · 2013-12-23T00:01:00

Solution 1

XML

<asp:TextBox ID="Template1TxtTo" runat="server" CssClass="sample-text-01" text="template1" placeholder="To...">
                                                     <asp:TextBox ID="Template1TxtFrom" runat="server" CssClass="sample-text-02" text="template2" placeholder="from...">

Suppose u have text attributes on both of the templates. Now, u have to show their respective msg on Label on click of either template.

XML

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

    <script type="text/javascript" language="javascript">

XML

$(function(){
$("#<%=Template1TxtTo.ClientID%>").click(function(){
var msg = $(this).attr('text');
$("#<%=lblTempolateTextInformation.ClientID").text(msg);
});

$("#<%=Template1TxtFrom.ClientID%>").click(function(){
var msg = $(this).attr('text');
$("#<%=lblTempolateTextInformation.ClientID").text(msg);
});

});

Try this, hope this will helps you...

Posted 23-Dec-13 0:01am

Jain Nishant

Comments

[no name] 23-Dec-13 6:50am

I am using this code for text display but when i am running application, so value has been cleared.
<script type="text/javascript">

var theInt = null;
var $crosslink, $navthumb;
var curclicked = 0;

theInterval = function (cur) {
clearInterval(theInt);

if (typeof cur != 'undefined')
curclicked = cur;

$crosslink.removeClass("active-thumb");
$navthumb.eq(curclicked).parent().addClass("active-thumb");
$(".stripNav ul li a").eq(curclicked).trigger('click');

theInt = setInterval(function () {
$crosslink.removeClass("active-thumb");
$navthumb.eq(curclicked).parent().addClass("active-thumb");
$(".stripNav ul li a").eq(curclicked).trigger('click');
curclicked++;
if (6 == curclicked)
curclicked = 0;

}, 200000);
};

$(function () {

$("#main-photo-slider").codaSlider();

$navthumb = $(".nav-thumb");
$crosslink = $(".cross-link");
$navthumb
.click(function () {
var $this = $(this);
theInterval($this.parent().attr('href').slice(1) - 1);
var result = $this.parent().attr('href');
if (result == "#1") {
$("#<%=lblTextTemplateId.ClientID%>").text("Template1");
// $('#lblTextTemplateId').text("Template1");
// alert("Template 1");
}
else if (result == "#2") {
$("#<%=lblTextTemplateId.ClientID%>").text("Template2");
// $('#lblTextTemplateId').text("Template2");
// alert("Template 2");
}
</script>
<asp:Label ID="lblTextTemplateId" runat="server" Visible="true">

value when we click on image button so value has been displayed but did not display in Session

Session["TempID"]=lblTextTemplateId.Text;

So, lblTextTemplateId.Text blanked.

[no name] 23-Dec-13 7:20am

When my page is postback so, my value has been cleared.