I want to check the content of textarea must contains previous inputs' words using javascript

137 Views Asked by At

Is it possible to check the content of textarea must contain previous inputs' all words using javascript or jquery? and if not contains all words than the value of textarea is invalid or will not submit. Please reply me soon.

Thanks.

3

There are 3 best solutions below

1
On BEST ANSWER

I think I understand what it is you're trying to get done: You want the user to utilize the previously given input of 35 words which is retrieved from input fields, but also give the user the option to add more. This addition is optional.

Check it out here

To be clear

input: 1, 2, 3 | textarea: 1, 2, 3 | returns true

input: 1, 2, 3 | textarea: 1, 2, 3, 4 | returns true

input: 1, 2, 3 | textarea: 1, 3, 2 | returns true

input: 1, 2, 3 | textarea: 3, 2, 1 | returns true

input: 1, 2, 3 | textarea: 2, 2, 1 | returns false

input: 1, 2, 3 | textarea: 1, 2 | returns false

JS

$("#submit").prop("disabled", true);

$(".input").on("keyup", function () {
    var input1 = document.getElementById("input1").value;
    var input2 = document.getElementById("input2").value;
    var input3 = document.getElementById("input3").value;
    var finalinput1 = input1 + " " + input2 + " " + input3;
    var finalinput2 = input1 + " " + input3 + " " + input2;
    var finalinput3 = input2 + " " + input1 + " " + input3;
    var finalinput4 = input2 + " " + input3 + " " + input1;
    var finalinput5 = input3 + " " + input1 + " " + input2;
    var finalinput6 = input3 + " " + input2 + " " + input1;
});



$("#area").on("keyup", function () {
    var content2 = $("#area").val();
    var input1 = document.getElementById("input1").value;
    var input2 = document.getElementById("input2").value;
    var input3 = document.getElementById("input3").value;
    var finalinput1 = input1 + " " + input2 + " " + input3;
    var finalinput2 = input1 + " " + input3 + " " + input2;
    var finalinput3 = input2 + " " + input1 + " " + input3;
    var finalinput4 = input2 + " " + input3 + " " + input1;
    var finalinput5 = input3 + " " + input1 + " " + input2;
    var finalinput6 = input3 + " " + input2 + " " + input1;
    if (content2.indexOf(finalinput1) >= 0 || content2.indexOf(finalinput2) >= 0 || content2.indexOf(finalinput3) >= 0 || content2.indexOf(finalinput4) >= 0 || content2.indexOf(finalinput5) >= 0 || content2.indexOf(finalinput6) >= 0) {
        $("#submit").prop("disabled", false);
    } else {
        $("#submit").prop("disabled", true);
    }
});

$("#submit").click(function () {
    var content2 = $("#area").val();
    var input1 = document.getElementById("input1").value;
    var input2 = document.getElementById("input2").value;
    var input3 = document.getElementById("input3").value;
    var finalinput1 = input1 + " " + input2 + " " + input3;
    var finalinput2 = input1 + " " + input3 + " " + input2;
    var finalinput3 = input2 + " " + input1 + " " + input3;
    var finalinput4 = input2 + " " + input3 + " " + input1;
    var finalinput5 = input3 + " " + input1 + " " + input2;
    var finalinput6 = input3 + " " + input2 + " " + input1;
    if (content2.indexOf(finalinput1) >= 0 || content2.indexOf(finalinput2) >= 0 || content2.indexOf(finalinput3) >= 0 || content2.indexOf(finalinput4) >= 0 || content2.indexOf(finalinput5) >= 0 || content2.indexOf(finalinput6) >= 0) {
        $("#output").text("Succes!");
    } else {
        $("#output").text("Values are not the same!");
    }
});
1
On

In JavaScript you can access the value of the textareas inner text by accessing the value.

Ex: document.getElementById("myTextarea").value = "Fifth Avenue, New York City";

You can then check this as you would any other JavaScript and on submit run the tests

1
On

This will check the value of the text entered on each keyup event against the value you define. If that returns true the submit property will not be disabled, otherwise it will be.

$('input[type="submit"]').prop('disabled', true);
    $("textarea").on("keyup", function(){
    if($(this).val() == 'value to check against'){
       $('input[type="submit"]').prop('disabled' , false);
       }
    else{
       $('input[type="submit"]').prop('disabled' , true);
       }
    })

https://jsfiddle.net/bgdogf2c/

If checking for an item in an array:

$('input[type="submit"]').prop('disabled', true);
    $("textarea").on("keyup", function(){
    if($.inArray($(this).val(), [ "one", "two", "three"] ) != -1){
       $('input[type="submit"]').prop('disabled' , false);
    }else{
       $('input[type="submit"]').prop('disabled' , true);
       }
    })

https://jsfiddle.net/yz2q6zga/1/