I took some code from W3Schools and edited it to remove numbers and trim leading and trailing whitespace. That works as expected and I’m happy with how it removes spaces and numbers.
I tried var str = myTrim(#input-q5); but was unable to get it working. not sure how to proceed.
function myTrim(x) {
return x.replace(/\d+|^\s+|\s+$/g, '').trim();
}
function myFunction() {
var str = myTrim("7987 iuiuh 98798");
alert(str);
$(str).val($('#input-q6').val());
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input-q5" Value="345 King Street">
<input type="text" id="input-q6">
<button onclick="myFunction()" id="test">Try it</button>
Below is a working snippet, first get the value and store it in val then assign it using the same function!
function myTrim(x) {
return x.replace(/\d+|^\s+|\s+$/g, '').trim();
}
function myFunction() {
var val = $('#input-q5').val();
var str = myTrim(val);
$('#input-q6').val(str);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input-q5" Value="345 King Street">
<input type="text" id="input-q6">
<button onclick="myFunction()" id="test">Try it</button>
Please Try This:
function myTrim(x) {
return x.replace(/\d+|^\s+|\s+$/g,'').trim();
}
function myFunction() {
var str = myTrim($('#input-q5').val());
alert(str);
}
Related
I'm trying to compare a input value with two paragrapah to check if the input value exists in both paragraph. So, I did this below. But the code is not working well :/. Could someone explain how to do it?
<input type="text" class="input-text" name="billing_district" id="billing_district" placeholder="" value="">
<p class="regions">Dias Macedo, Itaperi, Passaré, Taquara, Serrinha</p>
<p class="regions">Dias Macedo, Dendê, Edson Queiroz, Taquara</p>
<p class="regions">Jereissati, Dendê, Forquilha, Centro, Taquara</p>
jQuery(function ($) {
var a = $('#billing_district').val().normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase().split();
var b = $('.regions').text().normalize('NFD').replace(/[\u0300-\u036f]/g, '').toLowerCase().split(", ");
var index = $.grep(b, function (element, index) {
if ($.inArray(element, a) != -1) {
console.log(element);
}
});
});
This works, though you did not specify that the code should look at whole terms between commas. This code outputs true even if two letters occur in all the p's.
But you could add an extra loop to check the splitted strings.
jQuery(function($) {
const $input = $('#billing_district');
const b = $('.regions');
$('#billing_district').on('keyup', function(){
let a = $input.val();
let count = 0
$.each(b, function(i, p) {
console.log($(p).text().replace(/\s/g, ""),a);
if ($(p).text().replace(/\s/g, "").includes(a)) {
count++;
}
});
let valueIsInAllParagraphs = (count == 3);
console.log(valueIsInAllParagraphs);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="input-text" name="billing_district" id="billing_district" placeholder="" value="">
<p class="regions">Dias Macedo, Itaperi, Passaré, Taquara, Serrinha</p>
<p class="regions">Dias Macedo, Dendê, Edson Queiroz, Taquara</p>
<p class="regions">Jereissati, Dendê, Forquilha, Centro, Taquara</p>
I want to change the first letter to Uppercase when I write on the textbox.
I wrote the below code but it changes the letter in style of css and when I send it with form it send it with small word at first.
how can i transform to capitalize in jquery?
here is my code :
$('.capital').css('textTransform', 'capitalize');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="text" value="" class="capital"/>
Use toUpperCase and substr to get 1st letter and make it upper case.
$(".capital").focusout(function() {
var yourtext = $(this).val();
alert(yourtext.substr(0, 1).toUpperCase() + yourtext.substr(1));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="text" value="" class="capital"/>
This code always changes the first letter to uppercase. I think it's bad design to do so.
var firstCapitalAlways= function (event) {
var val = $(event.target).val();
var firstLetterUpper = val[0] ? val[0].toUpperCase() : "";
$(event.target).val(firstLetterUpper + val.substr(1, val.length));
}
var firstCapitalOnBlur = function(event) {
var val = $(event.target).val();
if(val){
$(event.target).val(val[0].toUpperCase() + val.substr(0, val.length))
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<label>Always</label>
<input type="text" value="" onkeyup="firstCapitalAlways(event);" class="capital"/>
<label>Onblur</label>
<input type="text" value="" onblur="firstCapitalOnBlur(event);" class="capital"/>
I have an issue with the following code. I want to replace a string by another one, and generate an img code. However, I got an error message: str.replace is not a function. Any idea why?
<input type="text" id="text">
<input type="button" value="See Code" onclick="myFunction();">
<input type="text" id="code" name="code">
<script>
function myFunction() {
var str = parseInt(document.getElementById("text").value);
var res = str.replace("ftpadress", "htmladress");
var code = str.concat("<img src='",res,"' width='100%'>");
document.getElementById("code").value = code;
}
</script>
As #mrlew pointed out,
str is result of parseInt and therefore, it's a number. replace() is a string method, so it will not work on a number.
If I understood correctly, you would like to replace a string, retrieve a code and then generate an image tag with the new string and code.
I'd go with...
<input type="text" id="text" />
<input type="button" value="See Code" onclick="myFunction();">
<input type="text" id="code" name="code">
<script>
function myFunction() {
//changed
var str = document.getElementById("text").value; //get text
var res = str.replace("ftpadress", "htmladress"); //replace
var code = parseInt(str).toString(); //get code and cast it back to a string
document.getElementById("code").value = code; //insert code
var withTag = code.concat("<img src='", res, "' width='100%'>"); //generate tag
}
</script>
parseInt returns an integer not a string so you can not use str.replace() , you need to cast it first
just add str = str.toString(); before using the replace function
Just remove the casting (parseInt function) and everything should work fine.
<input type="text" id="text">
<input type="button" value="See Code" onclick="myFunction();">
<input type="text" id="code" name="code">
<script>
function myFunction() {
//changed
var str = document.getElementById("text").value;
console.log(str);
var res = str.replace("ftpadress", "htmladress");
var code = str.concat("<img src='",res,"' width='100%'>");
document.getElementById("code").value = code;
}
</script>
http://jsbin.com/cunejafehe/edit?html,js,console,output
var reg = /^[a-zA-Z\d\s\-'#(),"]*$/;
function myFunction(e){
console.log(e.value);
if(reg.test(e.value))
{
return false;
}
}
<input onkeyup="myFunction(this)" type="text">
I wonder why above code doesn't work, what I want to do is allow only these character to be in the input : a-z and 1-9 including 0, and these character -'#(),"
Please have a look at this approach. Here i am passing an event object instead of DOM element reference and then we are checking it against Regx expression.
var reg = /^[a-zA-Z\d\s\-'#(),"0-9]*$/
function myFunction(e){
var c = String.fromCharCode(e.which)
console.log(c);
if(reg.test(c))
{
return true;
}
else
return false;
}
$(document).ready(function(){
$( "#mytextbox" ).keypress(function( e) {
return myFunction(e);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
Inline function : <input onkeypress="return myFunction(event)" type="text">
<br/>
Binding a function : <input id="mytextbox" type="text">
The test method belongs to a RegExp object, since you're not using that you should change reg.test(c) to c.match(reg) inside myFunction.
Moreover you are working on the full value of the field by passing this. I guess you can do something like this, even if not very elegant:
var reg = /^[a-zA-Z\d\s\-'#(),"]*$/;
function myFunction(e){
if (!e.value.match(reg)) {
e.value = e.value.slice(0, -1);
}
}
<input onkeyup="myFunction(this)" type="text">
I have recently started doing my own project with javascript and I ran into a roadblock. I'm doing a reverse string project where the user inputs a string and the output reverses it. Now my problem is that I can't get the reverse string to show up in the output area.
The Javascript part:
<script>
function pass() {
var input = document.getElementById('inputfield');
var output = document.getElementById('results');
var string = input.value;
var reverse = function (string) {
return string.split('').reverse().join('');
};
output.innerHTML = reverse;
}
</script>
The HTML:
<div id="reverse">
<h1>Type Below:</h1>
<form name="form">
<input type="text" name="inputfield" id="inputfield">
<button onClick="pass();">Submit</button></br>
<input type="text" name="out" placeholder="results" id="results">
</form>
</div>
You need to call the function.
output.value = reverse(input.value);
Luis,
When creating one function that receive an parameter, never forget to send this parameter.
In this case:
output.innerHTML = reverse(yourparameter);
Regards.
you will get reversed string like this:
output.innerHTML = reverse(string);
because
var reverse = function (string) {
return string.split('').reverse().join('');
};
is just a function declaration, the string is only a parameter of the function, but not equal to
var string = input.value;