JavaScript - Need Help Updating User Submitted Text...
What am I doing wrong here? I am trying to make it where the user can name the link whatever he/she wants.... I think it might be this part... links[i] = name.linkPosition.value; Where linkPosition is a variable. Can I do this? Or is there another way?
Code: <div id="navBar"> <ul> <li><a href="#" id="link0"><script>document.write(links[0]);</script></a></li> <li><a href="#" id="link1"><script>document.write(links[1]);</script></a></li> <li><a href="#" id="link2"><script>document.write(links[2]);</script></a></li> <li><a href="#" id="link3"><script>document.write(links[3]);</script></a></li> <li><a href="#" id="link4"><script>document.write(links[4]);</script></a></li> </ul> </div><!--end navBar --> <form> <label style="color: #FFF;">Change name of links! You can only change them once!</label><br /> <input type="text" class="customLink" size="15" name="link0" onblur="this.value=removeSpaces(this.value);" maxlength="8"/> <input type="text" class="customLink" size="15" name="link1" onblur="this.value=removeSpaces(this.value);" maxlength="8"/> <input type="text" class="customLink" size="15" name="link2" onblur="this.value=removeSpaces(this.value);" maxlength="8"/> <input type="text" class="customLink" size="15" name="link3" onblur="this.value=removeSpaces(this.value);" maxlength="8"/> <input type="text" class="customLink" size="15" name="link4" onblur="this.value=removeSpaces(this.value);" maxlength="8"/> <input type="button" onclick="replaceLinks(this.form)" value="Replace Link Names!" /> </form> Code: <script> var links = new Array("home", "portfolio", "stuff", "about me", "contact"); function replaceLinks(name){ for (var i=0; i<=4; i++) { var linkPosition = "link"+i; links[i] = name.linkPosition.value; changeLink(i); } } function changeLink(number) { document.getElementById("link"+number).innerHTML="<span style=\"text-transform: capitalize;\">" + links[number] + "</span>"; } </script> ANY HELP WOULD BE AWESOME!!! I just replaced the functions to look like this... Code: function replaceLinks(name){ for (var i=0; i<=4; i++) { links[i] = name.linker+i.value; changeLink(i); } } function changeLink(linkNumber) { document.getElementById("link"+linkNumber).innerHTML="<span style=\"text-transform: capitalize;\">" + links[linkNumber] + "</span>"; } Now the links are updating but I get NaN for each link. Similar TutorialsHi. I have developed a form all working fine but am struggling on the following. I need a checkbox for an item, when the checkbox is true the user can enter text in a text box, only if the checkbox is ticked. I have numerous items I need for this. Hope someone can help. Thanks I am trying to update the text in a span with a date (which is working fine), but I also want to format that date before it is updated in the span. For example, in the text area I input a date (format: YYYY-MM-DD HH:MM:SS), and I'd like to output between the span tags M-D-YYYY. Does that make sense? I'm totally lost here and hoping someone can help me out. Here is the javascript. Code: function show_post_date() { var ele = document.getElementById("post_date"); var text = document.getElementById("new_post_date"); // Get the date value, then format it var formatted_date = ele.value; // THIS IS WHAT I'VE TRIED, BUT NOTHING IS UPDATED INTO THE SPAN IF I INCLUDE THIS var curr_date = formatted_date.getDate(); var curr_month = formatted_date.getMonth(); var curr_year = formatted_date.getFullYear(); formatted_date = curr_date + "-" + curr_month + "-" + curr_year; // END SECTION OF WHAT I'VE TRIED if(ele.value != "") { text.innerHTML = formatted_date; } } Here is the element Code: When: <span id='new_post_date' style='font-weight:bold;'></span> <input type="text" name="post_date" id="post_date" value="" onChange='show_post_date()' /> I'm fairly new to JS so sorry in advance if this is a stupid question! I have a textarea which uses ckeditor to make it a wysiwyg. I also have a bit of JS which watches the ckeditor and when a user types into it, whatever they type appears in a div elsewhere on the page. My ckeditor allows the text to be bold, italic, underlined and resized. When I apply styles to the text in the ckeditor textarea, I want them to reflected in the div which updates. At the moment only underline and resizing the text works. Choosing bold or italic does nothing the text updates ok, but no bold or italic. I've been told: "Ckeditor is using strong for bold, em for italics. My guess is that the browser or framework you are using doesn't apply bold and italics styles to those tags. You'll have to do that yourself." I've tested on several browsers, I checked in FF Opera Safari Chrome IE8 & IE9 and its the same in all them. Underline works, resize works but neither bold or italic do. (Interestingly in IE7 bold and italic do work as well as the size and underline! What's going on with that?!?) So I assume it is the framework? Can anyone tell me if this is right and if so, how do I go about doing that myself? heres the JS I'm using to update the div: Code: <label for="editor1">Background Story</label> <textarea id="editor1" name="editor1">This is sample text</textarea> <div id="story"></div> <script type="text/javascript"> CKEDITOR.replace( 'editor1' ); timer = setInterval('updateDiv()',100); function updateDiv(){ var editorText = CKEDITOR.instances.editor1.getData(); $('#story').html(editorText); }</script> Hey guys, I just joined the forums (literally) and just started coding (mainly with CSS and HTML) about 3-4 weeks ago. I'd really like to get into JavaScript to make cool things happen on my website. With that being said, I've come up with a pretty cool idea but am not sure how to go about my problem. Enough with the chit chat. What I'm trying to do is add text to a user's input. For instance, if they write "Hello", the function should automatically add "World" to the output. I'd ideally like for the output to be searched on Google (think search engine) with the results displayed on a new page. Thanks in advance for any help! Hey everyone, I've looked around quite a bit and can't seem to find anything but I was wondering if there is some open source software offering a text editor/input field similar to the one used on this forum when submitting a comment or thread? Where you can click a bold button or Italic button or URL button to structure it? Thanks Josh Need help with my text box. I want to make it so if i have several text boxes only one number can be entered once. So if i type the number 15 in the first text box and type 15 in the second text box an error will occur saying you cant enter the same number twice. Any idea how to do this? Code: <html> <head> <title>Untitled Document</title> <script> function checkForInvalid(obj) { obj.value = obj.value.replace(/[^0-9\-]|(-{2,})/gi, (RegExp.$1.indexOf("-") > -1) ? "-" : ""); } </script> </head> <body> <form name="myForm"> <input type="text" name="one" onkeyup="checkForInvalid(this)"> <br> <input type="text" name="two" onkeyup="checkForInvalid(this)"> <br> <input type="text" name="three" onkeyup="checkForInvalid(this)"> </form> </body> </html> Thanks Is it possible to dynamically change the value of text on a page as the user types into a text box? E.g. like: You Are Typing: <script> var keyword = document.getElementById('string'); document.write(keyword); </script> Or I could probably insert it into a function and loop it over and over again or is there a better way? Hello, I have this search box form with 2 select boxes : Code: <form action="search.php" method="get"> <select name="RingType"> <option value="Nose">Nose</option> <option value="Toe">Toe</option> <option value="Belly">Belly</option> </select> <select name="NecklaceType"> <option value="gold">Gold</option> <option value="diamond">diamond</option> <option value="pearl">pearl</option> </select> <input type="text" size="60" name="keywords" /> <input class="submit" type="submit" value="Search" /> </form> For example, when a visitor selects "Belly" RingType, I want "Belly Ring" to appear in the search box. and when the visitor selects "pearl" NecklaceType, I want "pearl necklace" to appear in the search box. if the visitor first selects "Belly" RingType, and then selects "pearl" NecklaceType, I want "Belly Ring pearl necklace" to appear in the search box. After making his selections in the search box, if he types something in the search box, it should add to what is already there in the search box. Or, if he first types something in the search box for example, "jewelry" and then selects "pearl" in the necklacetype select box, the search box should show : "jewelry pearl necklace" Can you please show how to do this ? Thanks a lot. Hi all, Could someone please tell me how to properly add some text content before and after a user's selection? I am working with the TinyMCE editor, and I can get the following from it: * User's selection as a W3C compatible range * User's selection as a browser selection object * User's selection as a node (element) that encompasses the user's selection I also need the user's selection to remain selected after being wrapped. I've looked all over the web and could find nothing (except running into my OWN previous questions about this). Here's an example of what I'm trying to do: First line is original text, second line a part is selected, third line the selection is wrapped and the selection remains selected. I will greatly appreciate some help here. I've been asking everywhere and nobody seems to know (or they don't bother to answer). Thanks! -- Roger hi, I have a form with a tick at the end of each formfield: Code: <label>First Name<a href"#">click</a></label> <input class="text-input medium-input" type="text" id="medium-input" name="FirstName" /> <span class="input-notification success png_bg">Successful message</span> the style is currently set to display:none; I would like to use the FadeIn() method on the input-notification class when someone enters some text at the moment I am trying to test using a link to click on: Code: <script> $("a").click(function () { $("tab2").fadeIn(3000, function () { $("span").fadeIn(100); }); return false; }); </script> this doesn't work as I have 2 tabs and the link sends it back to tab1 I am trying to use a user defined function and text area for a project, but nothing is showing up in the text area when i click the button. Code: <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript"> function Greet() // Assumes: firstNameBox and companyName contain names // Results: writes a message with those names in messageArea { firstName = document.getElementById("firstNameBox").value; companyName = document.getElementById("companyNameBox").value; message = "To whom it may concern, my name is " + firstName + ", I am very interested in the job opening at, " + compnayName + ". I feel that I would greatly contribute to " + companyName + " success. I feel I fit the requirements needed to become an employee at " + companyName + ". I look forward to hearing from you."; document.getElementById("messageArea").value = message; } </script> </head> <body> <p> Enter your first name: <input type="text" id="firstNameBox" size="15" /> <br /> Enter the Company name: <input type="text" id="companyNameBox" size="15" /> </p> <p> <input type="button" value="Click for Greeting" onclick="Greet();" /> </p> <p> <textarea id="messageArea" rows="4" cols="40"></textarea> </p> </body> Yes - I need a script that will validate user input against a text file - exactly like the one in the left sidebar at http://www.oilpatchfuel.com/Pages/Welcome.aspx titled "Delivery Area". Thanks! This should be simple, but I can't quite get it to work without some kind of side-effect. I've checked the forum and there doesn't seem to be anything that directly relates. What I want to do is convert the text that a user is typing to uppercase as they type it. What I have so far: function convertToUppercase(aControl) { var cursorKeys ="8;46;37;38;39;40;33;34;35;36;45;"; if (cursorKeys.indexOf(event.keyCode+";") == -1) { aControl.value = aControl.value.toUpperCase(); } } <input onkeyup="convertToUppercase(this)"/> The problem that I have is that this moves the cursor to the end of the line after every character. If you want to go and add something to the middle of what you've typed, you can type one character and then the cursor jumps to the end. e.g. inserting "abc" between the "R" and "E" of "FRED" gets you: FRAEDBC What I need is either: 1) ability to get the cursor/caret position and restore it after I set the uppercase string -- or -- 2) ability to intercept the keystroke in the event and make it uppercase before the browser adds it naturally to the input's value. Solution should be browser-independent (if at all possible). I'm mostly interested in IE though. Thanks, Chris Hi all! I have a form called "theForm". How can I tell if the user has submitted the form or hit the submit button?? Is it.. Code: if(document.theForm.onsubmit()){ do something }else{ } hello there im unsure if this is the correct place to post this so if its not im sorry what im trying to do is make a javascript pop-up message in real time alerting members who are online at that time to a game submitted i help run a fifa10 online league site and we are venturing into the 2v2 part of the site. now when a player goes to the 2v2 page they are presented with a submit button to submit a 2v2 game to the system. then this already shows up on the pagebut what we are after is a little pop up box which after the game button is pressed to submit the game the pop-up shows to the whole site that a 2v2 game has been submitted for playing. we want this so you dont have to sit on the 2v2 page to wait for a submitted game. does anybody have any ideas on how we would go about this?? thanks for your time and i hope some1 can help - even if its just in the slightest Hello, I have a form which asks for some user data and then submits this data and inserts into a mysql database. I wanted to know the best way to validate the form before the data is submittted to the action script. For example, checking form fields to see if they are empty and also making sure no special characters are inserted by the user. The code I have tried is: Code: function checkForm() { var theForm = document.forms.feedback; if (theForm.fname.value == "" || theForm.loc.value="" || theForm.com.value == "") { alert("Please complete all of the form"); } } Working with this form: Code: <form id="feedback" name="feedback" action="php/phpcustom.php" method="POST"> <fieldset> <legend>Gardenable.com Feedback</legend> <p><label for="fname">Name:</label><input type="text" size="30" maxlength="40" id="fname" name="fname" /></p> <p><label for="loc">Location:</label><input type="text" size="30" maxlength="40" id="loc" name="loc" /></p> <p><label for="com">Comments:</label><textarea cols="40" rows="6" maxlength="300" id="com" name="com"></textarea></p> <p><input type="submit" name="send" id="submitbutton" value="Submit" onclick="checkForm()" /><input type="reset" name="reset" value="Reset" /></p> </fieldset> </form> I've added this function to the onclick attribute of the submit input button but it is just submitting the data and not executing. Just wondering if anyone could please explain how to stop the execution of the data being submitted and check the form before doing so. If not could you possibly advise any good sites/links for me to browse to achieve this. regards, LC. I want to type urls in a text field, submit such urls and extract pictures of these web pages. Does anyone know how I can do this using javascript? Thanks, Marcelo Brazil Hey guys I've got a really simple form: Code: <form name="nextform" method="post" action="page2.php"> <input type="checkbox" name="accepted" />I have read and accept the <a href="tsandcs.php" target="_blank">terms and conditions</a><br /><br /> <input type="image" name="next" alt="Next" src="'.$imagefolder.'next.jpg" /> </form> What I need to do is have it so that the form won't submit unless the tick box has been ticked. If they haven't ticked the box, then a little alert prompting them to do so would be great. I want to use JavaScript to do this, but if someone doesn't have JS enabled, I would like the form to submit anyway. I don't really want to grey the button out a tad. Any ideas guys? Cheers I'm using submodal-1.6 for popup. When the popup closes I wanted parent page to refresh.I've tried the following window.opener.location.load(); window.opener.location.load(true); location.load(); window.parent.location.reload(); All works for IE, but when coming to mozilla ,firefox the refresh is a step delayed, i.e when I open my popup to add an itme to my cart on parent page ,for the first time it does not show anything , but when I try to add another item , the first one shows. Any advice would be really great. |