CODEWITHSUNDEEP
javascriptjquery
user4827489
user4827489

Reputation:

Jquery working only when click first time not on other time

Hi I am having given code

<div class='school-name'>
    <select name="merry" id="exams">
              <option value="test1">test1</option>
              <option value="test2">test2</option>
              <option value="test3">test3</option>
    </select>

    <select name="date[year]" id="date_year">
        <option value="2013">2013</option>
        <option value="2014">2014</option>
        <option selected="selected" value="2015">2015</option>
    </select>
    <button type="button" class='farji'>Click Me!</button>
</div>
<div id='myText'> hii farjiz calendar January</div>

and in my js i have included this

$(document).ready(function() {
  $('.farji').click(function(){    
    currentSelectedYear = $("#date_year option:selected").val()
    alert(currentSelectedYear)
    switch ($("#exams option:selected").val()) {
      case 'test1':
        $("#myText").text(function(e, text) {
          return text.replace('January', currentSelectedYear);
        });
        break;
      case 'test2':
        $("#myText").text(function(e, text) {
          return text.replace('January', 'mario');
        });
        break;
      case 'test3':
        $("#myText").text(function(e, text) {
          return text.replace('January', 'popyee');
        });
        break;
       }
  })
})

So when I click on farji once it changes my text but when click on again then it does not change please guide me how to solve this. Thanx in advance

Upvotes: 3

Views: 327

Answers (5)

Dinh Duong
Dinh Duong

Reputation: 297

when you run 

case 'test1':
    $("#myText").text(function(e, text) {
      return text.replace('January', currentSelectedYear);
    });

$('#myText') have value is : "hii farjiz calendar 2015"

accrue when you click second 

case 'test2':
        $("#myText").text(function(e, text) {
          return text.replace('January', 'mario');
        });

$('#myText') don't have 'January' for replace.

Upvotes: 0

Dave Salomon
Dave Salomon

Reputation: 3297

Everyone's pointed out why it wont work a second time, but nobody's given you a solution.

Wrap 'January' in its own selector - you can then just set its text without having to worry about replace.

HTML:

<div id='myText'> hii farjiz calendar <span id="changeMe">January</span></div>

JS:

$('.farji').click(function(){    
    currentSelectedYear = $("#date_year option:selected").val();
    alert(currentSelectedYear);
    switch ($("#exams option:selected").val()) {
        case 'test1':
            $("#changeMe").text(currentSelectedYear);
            break;
        case 'test2':
            $("#changeMe").text('mario');
            break;
        case 'test3':
             $("#changeMe").text('popeye');
            break;
    }
});

For completion - your code always looks to replace the word 'January'. Once it's replaced the first time, the text no longer reads 'January', so replacing 'January' will have no effect.

Upvotes: 1

Nikhil Batra
Nikhil Batra

Reputation: 3148

There are few problems in your code:

1) You are replacing 'January' in test 1 but January doesn't exist. 2) After you have replaced 'January' with 'mario', then January cannot be found again because now there is mario hence it is not working.

See the fiddle : "https://jsfiddle.net/sga5mt0u/"

Here for "test1", january is replaced by the year(say 2015) Then for "test2", "2015" is replaced by "mario".

Upvotes: 0

Rohit Arora
Rohit Arora

Reputation: 2252

It will surely not work. It will Only Replace if text string contains January.

return text.replace('January','anything')

This looks for January in text string and replaces with anything if January exists.

Demo will only replace January once.

Upvotes: 0

Ahs N
Ahs N

Reputation: 8366

This is is because your code always looks for the word "January" to replace. The first time your code is executed, it replaces the word January by the year. The second time you click, it does not find the word January to replace by the selected year. Therefore nothing happens after the first replacement.

Upvotes: 1

Related Questions