I tried to pass the autocomplete value into another function.
<body>
<input id="automplete" name = "name"></input>
<input type="submit" onclick="mufunc()"></input>
<script>
function mufunc(a){
alert(a);
}
$(function() {
var availableTutorials = [
"ActionScript",
"Boostrap",
"C",
"C++",
"Ecommerce"
];
$("#automplete").autocomplete({
source: availableTutorials,
select: function(event, ui) {
if (ui.item) {
var seqps = new mufunc(ui.item.value);
}
}
});
});
</script>
</body>
Here autocomplete is works fine. I tried, it value pass into the mufunc() function and when i enter submit button that time only alert the autocompleted value.
But in my script when i fill the text field that time execute the mufunc() function. How can i manage it?
<body>
<input id="automplete" name = "name"></input>
<input type="submit" onclick="mufunc()"></input>
<script>
function mufunc(){
var a=document.getElementById('automplete').value;
alert(a);
}
$(function() {
var availableTutorials = [
"ActionScript",
"Boostrap",
"C",
"C++",
"Ecommerce"
];
$("#automplete").autocomplete({
source: availableTutorials,
select: function(event, ui) {
if (ui.item) {
$('#automplete').val(ui.item.value);
}
}
});
});
</script>
</body>
Without passing the varaible to another function it is possible. Because your textfield values is store into the autoomplete id then easily get the value of this id and do it.
you enter submit button that time only alert the autocompleted value. you can try to pass input id into call the function onclick="mufunc(automplete)"
Related
So i'm having page, where we have text_field. The problem that when i press submit button, then he post full page(i mean each record that is on page). To exclude this, i need to check if the value has been changed in text_field or it has been removed. Do you have any ideas how to check it?
P.S I'm having autocomplete on this field, so when he changes the number in text_field, then the hidden field hidden_val0 is filled by number(but this is only when you change value, not remove it).
Its HTML:
<input autocomplete="off" hidden_val0="hidden_val0" id="add_109_01000340001001002_id" name="add_109_01000340001001002[id]" type="hidden" value="111286507">
This is js code that i'm using:
var NewArr = new Array();
$('.something_here').bind('click', function () {
var id= $(this).attr('id');
collectID = $("[hidden_val0='hidden_val0'], [hidden_val1='hidden_val1'], [hidden_val2='hidden_val2']")
.map(function(_, it){
return [it.value] // Collecting 3 values witch we should pass
})
.get();
for (var i=0; i<collectID.length; i=i+3) {
NewArr.push(collectID.slice(i,i+3)); // Here we split values by 3
}
$.post('/do/it',
{
send_array: JSON.stringify(NewArr), // Pass them
id: id
},
function (response) {
location.reload();
}
);
});
Its output:
["01000340001001001", "", ""]
["01000340001001002", "", "2"]
["01000340001001003", "", "3A"]
["01000340001001004", "", "3"]
["01000340001001005", "", "5"]
["01000340001001006", "", "6"]
["01000340001001007", "", "7"]
How HTML looks like:
<input autocomplete="off" autocomplete_key="add_109" hidden_val1="hidden_val1" id="add_109_01000340001001002" name="add_109_01000340001001002" onkeyup="GetNumbers(this)" size="3" style="height: 10px" type="text" value="2" class="ac_input">
You can use something like this: (this code was not tested)
var dataArray = [];
$(function(){
$(document).on('change', 'input', function(){
var hid1 = $(this).data("hidden_val0");
var hid2 = $(this).data("hidden_val1");
var hid3 = $(this).data("hidden_val3");
dataArray.push([hid1, hid2, hid3])
});
});
$('.something_here').bind('click', function (event) {
event.preventDefault();
$.post('/do/it',
{
send_array: dataArray,
id: id
},
function (response) {
location.reload();
}
);
So i'v found this code to search other pages from the main page of my website, and it works great, but the autocomplete shows the link of the page instead of the title of the page , can anyone help me to modify the code ?
<form id="form1" runat="server" class="online-form">
<div class="ui-widget">
<input id="tags" class="form-control" placeholder="Rechercher un service…" required="" />
</div>
</form>
<script>
$(function () {
var availableTags = ["page1.html","page2.html","page3.html"];
$("#tags").autocomplete({
source: availableTags,
select: function (e, ui) {
var value = ui.item.value;
window.location.href = "../" + value;
},
});
});
</script>
The best way to make what you want and still continuing using jQuery's autocomplete is to create an additional array with the links. On select we will check the position of the AvailableTags array and then use the new array for the redirect.
<script>
$(function () {
var availableTags = ["Page 1", "Page 2"];
var availableTagsLinks = ["page1.htm", "page2.htm"];
$("#tags").autocomplete({
source: availableTags,
select: function (e, ui) {
var value = ui.item.value;
var indexPos = $.inArray(ui.item.value, availableTags);
window.location.href = "../" + availableTagsLinks[indexPos];
},
});
});
</script>
<script type="text/javascript>
function submitMe() {
var checked_ids = [];
$('#your-tree-id').jstree('get_checked',null,true).each(function(){
checked_ids.push(this.id);
});
//setting to hidden field
document.getElementById('jsfields').value = checked_ids.join(',');
}
</script>
<input type="hidden" name="jsfields" id="jsfields" value="">
I'm searching the way to get checked Ids of Jstree in form submit. So this is what I get. However, how I can call this function in my program?
Use a click/submit event
$(form).submit(submitMe);
or
$('[type="submit"]').click(submitMe);
Don't forget to prevent the default event and then trigger it after the code:
function submitMe(e) {
e.preventDefault();
var checked_ids = [];
$('#your-tree-id').jstree('get_checked',null,true).each(function(){
checked_ids.push(this.id);
});
//setting to hidden field
document.getElementById('jsfields').value = checked_ids.join(',');
window.location = $(this).closest('form').submit();
}
Guys I have an input text and when I start typing, it counts how many letters I am using. But when I clear the input value, I can't change letter counter. How can I get it?
Thanks in advance.
Jsfiddle
function count_letter() {
var len = $("#area").val().length;
$('#counter').append(len);
}
$('#area').bind('keyup', function() {
$('#counter').html('');
count_letter();
});
$('#clear-value').click(function(){
$("#area").val(" ");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="area"><br>
<div id="counter"></div><br>
<button id="clear-value">
Clear value
</button>
In the #clear-value event handler, add:
$('#counter').empty();
Which will clear the #counter element.
function count_letter() {
var len = $("#area").val().length;
$('#counter').append(len);
}
$(function() {
$('#area').bind('keyup', function() {
$('#counter').html('');
count_letter();
});
$('#clear-value').click(function(){
$("#area").val("");
$('#counter').empty(); //<<<-----
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="area"><br>
<div id="counter"></div><br>
<button id="clear-value">
Clear value
</button>
Just call your count_letter function when you clear the input value :
$('#clear-value').click(function(){
$("#area").val(" ");
$('#counter').html('');
count_letter();
});
Cleear your counter on click of clear value button.
See below in action:
https://jsfiddle.net/28bs18gq/2/
function count_letter() {
var len = $("#area").val().length;
$('#counter').append(len);
}
$('#area').bind('keyup', function() {
$('#counter').html('');
count_letter();
});
$('#clear-value').click(function(){
$("#area").val(" ");
$('#counter').html('');
});
Hello I have a var in a function when I hit submit...I want to pass the var"fieldNames" to my form....
$(document).ready(function() {
$("#submit").click(function() {
$("#sortable").each(function() {
var fieldNames = $(this).sortable('toArray').toString();
});
$("#detColumnSortorder").submit;
});
});
I want to pass this in my form: fieldNames
Put in a hidden input field in your form. Then set the value on the hidden field. That way when the form submits, the value in the hidden field will be submitted.
HTML:
<input type="hidden" name="fieldNames" value="" />
jQuery:
$(document).ready(function() {
$("#submit").click(function() {
$("#sortable").each(function() {
var fieldNames = $(this).sortable('toArray').toString();
$('input[name=fieldNames]').val(fieldNames);
});
$("#detColumnSortorder").submit;
});