JavaScript - Break A String Into Array Based On Text Pixel Width

Hi,

I'm hoping this will be an easy one for you experts out there.

I am working on a convention registration form.

What I'm trying to do is have the text "50.00" pop into the COST field when any text (even if it's only one character) is entered into the NAME field.

If the text in the NAME field is deleted, the "50.00" should also be deleted.

Does anyone have a script that does this?

Thanks!

I've been running into some trouble with a script that just isn't working, and since I'm not encountering any error messages and a similar script on the same page is working just fine, I'm really puzzled.
Anyways, here's the code I'm having trouble with:
Code:

function ShowHide(Numb){
Ident1 = AdIDList[Numb]+"Tx";
Ident2 = AdIDList[Numb]+"Lnk";
if (AdLink[Numb] == "hidden"){
	document.getElementById(Ident1).style.height = "355px";
	AdLink[Numb] = "visible";
}
if (AdLink[Numb] =="visible"){
	document.getElementById(Ident1).style.height = "55px";
	AdLink[Numb] = "hidden";
}
}

And here's the page code calling it (The page is assembled via PHP from a database, but I'm grabbing the code from my browser)
Code:

 <a href="#Good ShepherdLnk" id="Good ShepherdLnk" onclick="ShowHide(2);return false;" class="AdLink">Stories</a><br>

And, here's a similar bit of code on the same page that is working just as it's supposed to.
Code:

 function hideimage(){
for (Count=0; Count<AdTotal; Count ++){
	if (VisPic[Count]=="visible"){
		Ident = AdIDList[Count]+"AdB";
		document.getElementById(Ident).style.visibility = "hidden";
		VisPic[Count]="hidden";
		}
}
}

function bigimage(Item){
hideimage();
Ident1 = AdIDList[Item]+"AdB";
document.getElementById(Ident1).style.left="35%";
document.getElementById(Ident1).style.visibility = "visible";
VisPic[Item] = "visible";
}

Hello,

I am trying to get all the div tags in my page into an array but only the tags with the ID "image**". Below is what I came up with but this doesn't seem to work, even after googling a bit I couldn't find any solution. I don't think this should be so hard but I'm very new to JavaScript (tbh programming in general) and can't seem to come up with a solution.

Any help or pointers would be greatly appreciated.

Code:

function divs() {
	
	var divs = document.getElementsByTagName('div');
	var ImageTags = [];
	
	for (i=0; document.getElementsByTagName('div').length; i++) {
		
		var div = divs[i];
		
		if (/image[0-9]*/.test(div)) {
			
			imageTags.push(div);
		}
	}
}

Anyone ever did this before?

domain1.com will have a paragraph of one currency price
domain2.com will have the same paragraph with a different currency price.

I am looking for a bit of Javascript that can hide a sentence in my website if the URL contains certain words, most specifically INFO or CERT. Any idea how I can do this?

Your help is appreciated.

Thank You,

Kevin Brown

I want to insert text to a textarea based on the selected text. It should insert tags like the buttons for posting on this form work. Ie: If 'bar' is selected, and I click 'b', then I get:

Code:

Foo bar frog

becomes: Code:

Foo <b>bar</b> frog

I found some code that works for firefox, but I need it to work in explorer as well.

Do you have any ideas or examples how to do this?

Here's the code I'm currently using. ( Works right in ff3. In IE7 it appends the tags at the end of the text. I want it to insert based on my selection. )

Usage: Code:

<a onclick="insertTags('<b>', '</b>', document.forms.formpost.text);return false;" href="javascript:void(0);">[ Bold ]</a>

insert function: Code:

<script type="text/javascript">
// Surrounds the selected text with text1 and text2.
function insertTags(text1, text2, textarea)
{
	// Can a text range be created?
	if (typeof(textarea.caretPos) != "undefined" && textarea.createTextRange)
	{
		var caretPos = textarea.caretPos, temp_length = caretPos.text.length;

		caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text1 + caretPos.text + text2 + ' ' : text1 + caretPos.text + text2;

		if (temp_length == 0)
		{
			caretPos.moveStart("character", -text2.length);
			caretPos.moveEnd("character", -text2.length);
			caretPos.select();
		}
		else
			textarea.focus(caretPos);
	}
	// Mozilla text range wrap.
	else if (typeof(textarea.selectionStart) != "undefined")
	{
		var begin = textarea.value.substr(0, textarea.selectionStart);
		var selection = textarea.value.substr(textarea.selectionStart, textarea.selectionEnd - textarea.selectionStart);
		var end = textarea.value.substr(textarea.selectionEnd);
		var newCursorPos = textarea.selectionStart;
		var scrollPos = textarea.scrollTop;

		textarea.value = begin + text1 + selection + text2 + end;

		if (textarea.setSelectionRange)
		{
			if (selection.length == 0)
				textarea.setSelectionRange(newCursorPos + text1.length, newCursorPos + text1.length);
			else
				textarea.setSelectionRange(newCursorPos, newCursorPos + text1.length + selection.length + text2.length);
			textarea.focus();
		}
		textarea.scrollTop = scrollPos;
	}
	// Just put them on the end, then.
	else
	{
		textarea.value += text1 + text2;
		textarea.focus(textarea.value.length - 1);
	}
}
</script>

Curious about the following issue. I currently have a dynamic drop-down based on the value of each option.. If selection in top drop-down is B it will show all options with a B contained in the second/resulting drop-down.

Now - I also want to evaluate the options by having the script check for a few keywords..

Example - have it evaluate the drop-down on page load for options with text containing 'blah123' (ex. <option value="0323G">Qwerty - blah123</option>). And if any of the options have that text the script will generate an additional drop-down menu allowing you to select blah123 or other specified text. Say another thing I'd like to search each text string for is 'abump'. If there is 'blah123' and 'abump' contained within the drop-down, a third drop-down menu will be generated (as said before) with only blah123 and abump as options. Whichever of these is selected will narrow down the options available in the final drop-down menu.

If any clarification is needed I would be more than happy to make this more clear. Any ideas?

Hi Guys,

I am looking for a script to change text on a page based on the time of day. From 9am - 5pm weekdays I would like the page to display 'Open', and outside of that window to display 'Closed'. I am using HTML & PHP.

Any help would be greatly appreciated.

Thanks,
Matt

I have an array:
Code:

var array_123=["test1","test2","test3"];

I have a string:
Code:

var array_string = "array_" + "123";

I would like to use the value of array_string (array_123) as an array to parse out the values of it. But this isn't working:
Code:

for (var x in array_string)
  {
  var test_ary = array_string[x];
  }

Any help?

I am working on a page where the user will select a location from a dynamically generated dropdown list.

I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form.

For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields.

php array creation:
Code:

if ($row_locations) 
{ 
	while ($row_locations = mysql_fetch_assoc($locations))  
	{ 
		$mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']);
	} 
}

javascript function - this should create the array and send variables to text fields.
Code:

function updateAddress() {
var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>);
{
if (comp_id in mail) {
document.getElementById('mailto').value=mail.comp_id.mailto.value;
document.getElementById('madd').value=mail.comp_id.madd.value;
document.getElementById('madd2').value=mail.comp_id.madd2.value;
document.getElementById('mcity').value=mail.comp_id.mcity.value;
document.getElementById('mstate').value=mail.comp_id.mstate.value;
document.getElementById('mzip').value=mail.comp_id.mzip.value;
} else {
document.getElementById('mailto').value='';
document.getElementById('madd').value='';
document.getElementById('madd2').value='';
document.getElementById('mcity').value='';
document.getElementById('mstate').value='';
document.getElementById('mzip').value='';
}
}
}

Where is this breaking?
Thanks in advance.

I'm taking a beginning javascript class and have been trying to figure out one last part of a homework assignment and am just not seeing how to work it out. Any help is greatly appreciated!

What I'm having trouble with is doing the text verification. When a user selects an option from the select list they then need to type in the text area given. If the user doesn't type the word selected in the list then an error message should appear under the text area. If you look at my code you'll see that I have the text_check() function doing the verification. I can get it to work when there is only one option but once I add the other two it stops working. I've tried if... else and other variations, but can't seem to nail it down. Thanks!

Code:

function select_function()
{
 var medical=document.getElementById("medical_list")
 var selected_item=medical.selectedIndex
 if (selected_item==0)
 {
 	document.getElementById("enter_info").innerHTML="Enter Your" +"<span style='color:blue'>" +" Medication" + "</span>"+ " Information"
	var comments=document.getElementById("comments");
	comments.focus();
	
 }
 if (selected_item==1)
 {
 	document.getElementById("enter_info").innerHTML="Enter Your" +"<span style='color:blue'>" +" Hospitalization" + "</span>"+ " Information"
	var comments=document.getElementById("comments");
	comments.focus();
 }
 if (selected_item==2)
 {
 	document.getElementById("enter_info").innerHTML="Enter Your" +"<span style='color:blue'>" +" Physician" + "</span>"+ " Information"
	var comments=document.getElementById("comments");
	comments.focus();
 }
 
}

function text_check()
{
  var user_comments=document.getElementById("comments").value.toLowerCase(); 
	var med_comment=user_comments.indexOf('medication');
	var hosp_comment=user_comments.indexOf('hospitalization');
	var phys_comment=user_comments.indexOf('physician');	

 	mySelectList = document.getElementById("medical_list");
 
 	if (mySelectList.value='Medication' && med_comment==-1) 
	{
	 document.getElementById("word_error").innerHTML="You need to have the word,"+"<span style='color:red'>"+" Medication"+"</span>"+" somewhere in the text"; 
	}
	
	if (mySelectList.value='Hospitalization' && hosp_comment==-1)
 	{
 		document.getElementById("word_error").innerHTML="You need to  have the word,"+"<span style='color:red'>"+" Hospitalization"+"</span>"+" somewhere in the text";
	}	
	
	if (mySelectList.value= 'Physician' && phys_comment==-1)
	{
 	 document.getElementById("word_error").innerHTML="You need to have   the word,"+"<span style='color:red'>"+" Physician"+"</span>"+" somewhere in the text";
	}
}
	
function submit_alert()
{
 alert("You submitted the form")
}

function clear_error()
{
 document.getElementById("word_error").innerHTML=""; 
}

function changeDR()
{
 var my_textarea=document.getElementById("comments");
 
 var comment_string=my_textarea.value;
 
 var doctor=comment_string.indexOf('Dr.');

 var comment_string2='';
 
 if (comment_string < 0)
 {
 	comment_string2=comment_string
 } else {
 	 			comment_string2=comment_string.replace('Dr.','Doctor')
 }
 my_textarea.value=comment_string2;
 
}
</script>
</head>
<body style="background-color: silver">
<h2>Medical History</h2>

Select Category: <br>
<select id="medical_list" onChange="select_function();">
<option>Medication</option>
<option>Hospitalization</option>
<option>Physician</option>
</select>
<br><br><br>

<div id="enter_info">Enter Your <font color="blue">Medication</font> Information:</div>
<br>

<form method="post" action="">
<textarea id="comments" cols="60" rows="15" onBlur="text_check();" onFocus="clear_error();" onkeyup="changeDR();">
</textarea><br>
<div id="word_error"></div><br>
<input type="submit" value="Submit Information" onClick="submit_alert();"/>
</form>


</body>
</html>

So i've written up the code to do a lightbox esque overlay image gallery. everything is working smooth and fine. The only concern is that I have the following:

lets say that I have a page that has multiple galleries. Obviously I would have to make each literal array with the gallery data different names, ex:

Code:

var _gallery1 = {
	'images': [
		{ 'id' : 1, 'src' : "" }
	]
}

var _gallery2 = {
	'images': [
		{ 'id' : 1, 'src' : "" }
	]
}

or would it be easier to do it multi dimensional?

Code:

var gallery_data = {
	'gallery1': [
		'images': [
			{ 'id' : 1, 'src' : "" }
		]
	]
	'gallery2': [
		'images': [
			{ 'id' : 1, 'src' : "" }
		]
	]
}

regardless of which direction I use... my main question is this:

I have two variables which are the following:

Code:

galVariable = (i = location.hash.match(/#set=(.+)&photo=(\d+)/)) ? i[1] : null;
galArray    = _gallery2.images;

I'm unfamiliar with a way of doing something along the lines of this, and having it actually work:

Code:

galVariable = (i = location.hash.match(/#set=(.+)&photo=(\d+)/)) ? i[1] : null;
galArray    = galVariable.images;

obviously "galVariable" would be undefined... as i'm trying to get "_gallery2.images" but trying to use "galVariable" to point to "_gallery2"

I'm familiar with solving a problem like this in PHP, not so much javascript. is there a JS function that can be used to ensure that it's using whatever "galVariable" equals to, and then that array's content is? Or is there a different way to go on about this.

thanks in advance. if anyone needs some more clarification. please feel free to ask, and I'll respond asap.

Hello everybody !

I'm searching for a javascript function that convert array to query string. Like this example :
Code:

var array = { a=1, b=2, c=3 };
to 
a=1&b=2&c=3

I'm using jQuery and the function .serialize() convert only html forms. Does someone know a function to do this ?

Thanks !

I have

var att=7,8,9

how can I convert these to an array so I can loop through the values?

Hello,

1. I have the following script:

function selectThis(id){
var locationstring = "process.php?value=" + id; /////
locationstring += "&bs=" + $('#bs_' + id).attr("selectedIndex");
locationstring += "&ad=" + $('#ad_' + id).attr("selectedIndex");
locationstring += "&ns=" + $('#ns_' + id).attr("selectedIndex");
locationstring += "&wt=" + $('#wt_' + id).attr("selectedIndex");
locationstring += "&in=" + $('#in_' + id).attr("selectedIndex");
document.location.href = locationstring;
}

With it I am getting a string with the value of the clicked button from an array and some other select field values that are listed in the same set of mysql results as the clicked button.

BUTTON:
<input name="button" type="button" onclick="selectThis('<? echo $rows['id']; ?>');" value="">

At the end of the script the page is redirected to in the script mentioned page with following string:

process.php?value=1&bs=2&ad=3&ns=4&wt=5&in=6

(values are not real, so whatever the chosen value of the select field should apear in the link.)

THIS WORKS FINE.


2. My problem is following:

In order to be able to use var locationstring in other scripts as well I have removed var and have made it global.

function selectThis(id){
locationstring = "process.php?value=" + id; /////
locationstring += "&bs=" + $('#bs_' + id).attr("selectedIndex");
locationstring += "&ad=" + $('#ad_' + id).attr("selectedIndex");
locationstring += "&ns=" + $('#ns_' + id).attr("selectedIndex");
locationstring += "&wt=" + $('#wt_' + id).attr("selectedIndex");
locationstring += "&in=" + $('#in_' + id).attr("selectedIndex");
}

The problem is that later on when I use locationstring variable in other script I get only first variable in the string

process.php?value=1

instead of

process.php?value=1&bs=2&ad=3&ns=4&wt=5&in=6

3. Is it possible to make locationstring variable global and in a single line in order to be able to use the full string in other scripts or is there another solution.

Thank in advance.