CODEWITHSUNDEEP
javascriptjqueryhtml
user2128903
user2128903

Reputation: 57

How to remove whitespace from input during Jquery keyup event before displaying

    <div>
    <tr>
        <td>flat1:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price1:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>
    </tr>
</div>
<div>
    <tr>
        <td>flat2:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price2:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat3:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price3:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>
    </tr>
</div>
<div>
    <tr>
        <td>flat4:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price4:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat5:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price5:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat6:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price6:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat7:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price7:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat8:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price8:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat9:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price9:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>

        <div>
    <tr>
        <td>flat10:<input type="text" name="flat[]" class="flat" value=""/></td>
        <td>price10:<input type="text" name="new_price[]" class="new_price" value=""/></td>
        <td><input type="text" name="org_price[]" class="" value=""</td>

    </tr>
</div>


<p><input type="submit" name="save" value="save"/></p>

I want to display what is typed in .flat input box to .new_price input box on keyup Jquery event. I've accomplished this, but now I want to remove white space from displaying in the .new_price input. I attempted to use the replace method with no luck. http://jsfiddle.net/qsDn5/3/

$(document).ready(function(){
    $('.flat').on('keyup',function(e) {
       $( this ).siblings(".new_price").eq(0).val ( $(this).val() );
    });
});

Upvotes: 3

Views: 6683

Answers (2)

mpalencia
mpalencia

Reputation: 6047

Add this class 'auto_remove_space' on your element

and on JS add

$('.auto_remove_space').on('keyup',function(e) {
  $( this ).val($( this ).val().replace(/\s/g, ''));
});

Upvotes: 3

Timeout
Timeout

Reputation: 7909

Post edited based on your comments. The way you described it was somewhat misleading.

Just use a string replace in your case.

$(this).val().replace(/ /g, "");

The / / syntax means a regular expression matching a space and the g at the end means global so that it replaces more than just the first occurrence.

Updated jsfiddle HERE

Upvotes: 7

Related Questions