How to Append a List of Items to a Textbox Value on Another HTML Page

Question

I'm having one page, choosemerchant where I get the list of merchants. After selecting a list item I want to append that list item value to the textbox id which belongs to a different html page. Here is my code:

$('.ui-li-icon li').click(function() {
    var index = $(this).index();
     text = $(this).text();
    alert('Index is: ' + index + ' and text is ' + text);
    sessionStorage.setItem("selectedMerchant", text);
    window.location="recommendmanual.html";
    $('#merchant').append(text);
});

And in my page which contains textbox id=merchant I have put this code in script:

var selectedMerchant = "";
if ( sessionStorage.getItem("selectedMerchant") ) {
    selectedMerchant = sessionStorage.getItem("selectedMerchant");
}

It worked before, but now it's not working.

Comment out code until it works. Since it worked before, the error must be with something you added since then. If you have a version control system installed (which you should), you can compare the old and the new code easily. — David
– David, Commented Apr 23, 2014 at 12:22
Try to describe in detail in what way it's not working. Do you get a javascript error in the console? — David
– David, Commented Apr 23, 2014 at 12:23
you say #merchant is in next page, but how you append in click of first page ? doesn't this comes in next set of code you mentioned ? — Navin
– Navin, Commented Apr 23, 2014 at 12:42
@David my code is working upto alert('Index is: ' + index + ' and text is ' + text); after this its going to that recommendation page also.and in divsion.its showing empty data. — user3415421
– user3415421, Commented Apr 23, 2014 at 13:16
@user3415421:Ok, visit this page videmadesign.herobo.com/choosemerchant.html, when you click on li you'll navigate to recommendmanual.html and you'll see the merchant in the text box. You can use firebug to see the code that is the same of my answer. — Devima
– Devima, Commented Apr 24, 2014 at 7:52

Devima · Accepted Answer · 2014-04-23 12:39:19Z

1

I don't know if I understand correctly your question and if this will help you
But if you want by clicking on an li element in your choosemerchant page the clicked item text appears inside the texarea on the page recommendmanual
this is the code for choosemerchant page:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.ui-li-icon li').click(function() {
        var index = $(this).index();
        var text = $(this).text();
        sessionStorage.setItem("selectedMerchant", text);
        console.log(sessionStorage)
        window.location="recommendmanual.html";
    });     
})
</script>
<ul class="ui-li-icon">
  <li>Merchant 1</li>
  <li>Merchant 2</li>
  <li>Merchant 3</li>
  <li>Merchant 4</li>
</ul>

and this is the code for your recommendmanual page

<script type="text/javascript">
$(document).ready(function(){
    var what=sessionStorage['selectedMerchant']
    $('textarea').val(what)
})
</script>
<textarea name="merchant" cols="100" rows="10"></textarea>

With this solution if you click on one li item in the first page text will appear in the second page textarea.
if i have not understand correctly your question and this solution does not suit your needs, i apologize for making you lose time.

answered Apr 23, 2014 at 12:39

Devima

1,5662 gold badges10 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

David Over a year ago

w3schools reference on HTML5 web storage: w3schools.com/html/html5_webstorage.asp

Axel Amthor · Accepted Answer · 2014-04-23 12:41:38Z

1

the second of these two lines:

 ...
 window.location="recommendmanual.html";
 $('#merchant').append(text);
 ....

will not be reached: the browser will immediately start loading "recommendmanual.html" and stop executing the current script.

answered Apr 23, 2014 at 12:41

Axel Amthor

11.1k1 gold badge28 silver badges45 bronze badges

3 Comments

user3415421 Over a year ago

yes..so how can i change the value of that merchant id to the value of merchant name..?

David Over a year ago

@user3415421 The answer by Devima above solves this issue by storing the data to append using sessionStorage. I believe you can make that work. You could also use HTTP GET. window.location="recommendmanual.html?append="+text; and then check the value of window.location on the page recommendmanual.html

Axel Amthor Over a year ago

even if you swap these lines, this has no visible effect, since the browser will start loading the new page and the user will not see the altered value anyway.

Venkat · Accepted Answer · 2014-04-23 12:37:23Z

-1

one thing append text to #merchant before you redirect to other page i.e., $('#merchant').append(text); this should be before window.location="recommendmanual.html";

answered Apr 23, 2014 at 12:37

Venkat

628 bronze badges

1 Comment

David Over a year ago

Won't work. The first line will modify the DOM on the current page, the second line will load a new DOM, discarding the changes made by the first line.

Collectives™ on Stack Overflow

How to Append a List of Items to a Textbox Value on Another HTML Page

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related