I have a list on the clientI would like send all the c1/c2 pairs to a PHP server.I nderstand the Ajax part, but not how to serialize the data
Code:
<ul id="fieldList">
<li data-c1="34" data-c2="32">Hello</li>
[code]....
Basically I have a unordered list with LI's and form/inputs within the LI's. Looks kinda like this...
<ul><li>
My LI
<form><input name='input_1'>
<input name='input_2'></form>
</li><li>
My second LI
<form><input name='input_1'>
<input name='input_2'></form>
</li></ul>
What I want to be able to do it loop though each of the li's, grab the values from the form inputs and serialize themas JSON.
I've got such code:
var tmp = $('#someform').find('input').serialize();
And it works almost fine. If we have fields like:
<input type="text" value="some words" />
Serialization seems to behave a bit weird. In general it's serializing spaces into + which later cannot be (or I have no idea how) deserialized correctly. If you want proof of concept go under this link: [URL] If this question is so obvious that was asked and answered bilions of times I recommend to add special notice into documentation. I googled a lot and I have seen very complex examples of how serialization works or is not working at all but nowhere was an example with value with two words in it.
I have developed my own tools for serializing form data for asynchronous calls to the server (AJAX). I have consider many times that it would be useful that when a select element has both text and option values to send both values to the server. I have thought about a couple of different ways of doing this. But first let me give an example so that there is less chance of misunderstanding.Suppose I have a drop-down list that is a select element with an option list wherein each member of the option list has both a value and a text string.
as in Code:
<select name="state"><option value="1">Alabama</option>...</select>
And suppose I composed my javascript code in such a way that the value and the code are both included with a separator. Example Code:
&state=1|Alabama&keyfoo=keybar....
and '|' is the separator.
I have a jQuery form in which I create a series of checkboxes:
<?php
javascript
At the moment createb.php is just testing the form
The Problem is that the serialize function only sees the first checkbox and indicates whether it has been checked or not. It does not see any of the other check boxes. Does anybody have an idea why the other check boxes do not get serialized and what to do about it?
I'm having a problem where the serialize method isn't serializing form elements that are added to the DOM after the page load. Specifically, when the user clicks on a button some elements are displayed in a dialog that are generated from my server and returned via AJAX. I'm converting from Prototype and didn't run into this problem.
View 5 Replies View Relatedhow about getting the attributes of the a tag? href and title and the innerhtml (actually the innerhtml has space on both ends)
View 4 Replies View RelatedIs it possible to take an ASP textbox that has an attribute of
visible='hidden' and make it visible from javascript? I dont want it
to be visible until data on the page has been entered and thus need a
way to dynamically change its visibility?
Can someone tell me if there is a universal way to check the available
screen with and screen height for IE, Netscape, and Opera? Is there a
universal syntax?
I'm using a jquery plugin called jplayer. I need to "bookmark" the current track.
The only way to know the current file playing is to look at the div called jplayer_playlist_current.
<li class="jplayer_playlist_current">
<a href="#" id="jplayer_playlist_item_1" class="jplayer_playlist_current">Introduction and guidance on usage</a></li>
What I want to get from it is the id, ie: jplayer_playlist_item_1
I thought that this might cover it:
[URL]
But nothing I do, no amount of googling or plugins, is getting me this result.
I want to move a div around a page, and I do this by getting the original top and left values of a div, and then change them. But the problem is getting the original values; I checked online and thought that this would work:
var chart = document.getElementById(charDiv).style.top;
var charl = document.getElementById(charDiv).style.left;
alert('char_t:' + chart + ' char_l:' + charl + 'charDiv:' + charDiv);
charDiv is passed into the function (its the id of the div I want to move). I know that charDiv has a value by looking at the values of the alert() statement, but the values of chart and charl are empty. The alert simply outputs char_t: char_l: charDiv: charOne
I'm new at JS.
I need to remove TR elements from parent table but the problem is there are no table ID/Name
Is it possible to perform it?
Please see attach - i need remove red marked block... what scrip i have to use if i will put it to the green block?
I attempting to set attributes for all tags of a particular type....
I have a bunch of thumbnails <img> tags; when I wand over them I would like to show the corresponding large image with a script but the tags require onMouseOver events. I really don't feel like adding a bunch of onMouseOver="myShowScript" attributes to every img tag manually...
my scripts aren't working. I'm sure there is some fundamental concept about java and html I don't get...
here's ONE of the versions that doesn't work.. I've tried a few things but I'm open to scrapping everything for a better way...
function addAtts(){
var numberOf = document.getElementsByTagName("img");
for(i = 0; i < numberOf.length; i++){
numberOf[i].onMouseOver="myShowScript()";
}
}
I have this js function for pulling out a couple of links which I want to add onclick handlers to... but IE can't find the rel attribute the way Im doing it, Im assuming it can another way, but I dont know how?!this works in Chrome, but not IE... the category_links.length yields a fat 0.
function get_product_categories_links(){
var links = document.getElementsByTagName('a');
var category_links = [];
[code]....
I have a table that has parts with multiple characteristics. Part Number, Height, Width, Capacity, Price, Etc. I would like to have a drop downs for all of these values, when a user selects one of these values it will filter the results into a list. Ex. user selects a part that has a Height of 6 and width of 10 it will only list those parts. As I said earlier, I have a script that will give me all the parts, however I am not able to make the onchange list parts with multiple values.
View 9 Replies View RelatedI have a page that displays a list of people playing in a tournament. I need to be able to generate a Leaderboard based on which players are manually selected by the admin. Next to each person there is a drop-down list. An admin can go in and select a "slot" that a player should be in on the leader board from 1 to 8, or leave it blank if none. What I need to figure out how to do is the following, when a change event happens on a drop-down list, and say the value 5 is selected, I need to check to make sure that 5 is not already selected in one of the other players drop-down lists, in other words, that the 5th leaderboard slot is not already full. if it is, display an error message and make them change that one first. how to do that with jQuery? I'm thinking it will have something to do with the each() function, but not sure exactly how the logic should work.
View 4 Replies View Relatedi have a menu and i would like to change the color of the Categories which have subcategories only. In my example the basic categories are: News , Announcements , Contact and Career. Only Announcements and Career categories have subcategories. So i would like those two to turn green. The fact is that the list items include a href ,so i don't know how to access those "a href" combined with "this".
<ul id="my_menu">
<li id="id0"><a href="#" style="text-decoration:none">News</a></li>
<li id="id1"><a href="#" style="text-decoration:none">Announcements</a>
<ul>
[Code].....
I have been trying to make an expand/collapse (essentially accordion) list. So far, everything works and looks fine in Firefox, Safari, and Chrome, but in IE8, the page height is static when it loads, with a page height being as if all headers in the list were expanded. The expand/collapse functionality works,but as you can imagine, there is this big gap of space after the list.
The html markup uses <h2> tags for the always-visible header portion and a <div> for the expanding/collapsing content. The <div> content contains form elements and everything is enclosed in a form tag.Anyways, here is the jQuery code:
$(document).ready(function() {
$('<img src="plus.png" class="icon" />').prependTo('.header');
$('.content').hide();[code].....
i am writing a script that will update a dropdown list based on the selection of a previous list. the script is run by a PHP script, so instead of posting the PHP, i will post an example client-side script. the hierachy is: category, sub category, brand (but sometimes there exists no sub category and the PHP script queries and adds brands instead) everything works correctly, except for one major issue: you can not change the selection of the third (brand) box this could be an easy fix for some coders, but i am not experienced in javascript and could really use some help. here is an example script, sorry it is so long
[Code]...
I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County).I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database.This piece of code is working well . . . .
<?php
$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');[code]......
I have 3 ASP list boxes. I would like to populate the second list box based on the selection in the first list box and based on the selection in the second list box, populate the third. I would like to do this using AJAX. How can I do it? Can someone please give me the code snippet as I am a complete noob when it comes to AJAX and I kinda am running outta time to finish implementing it. Additionally, should I use ASP boxes or HTML <select> tag?
View 4 Replies View RelatedI have an application where a user can create a newsletter with a
contenteditable div box and submit it to a database. The problem occurs
when the user tries to edit their newsletter. The edit page looks
exactly like the create page only their already created newsletter is
supposed to appear in the contenteditable div box. To do this I
retrieve the information from the database in the server side. Then I
have the following client side script.
window.onload=doInit
function doInit() {
var content = "<%=sContent%>";
div.innerHTML = content;
}
This seems to work in all cases except if the HTML to be displayed
contains any style attributes. For example, if any of the text has
background color then the HTML code will have the tag <font
style="bacground-color: #000000"> and this will cause nothing to appear
in the div box. Has anyone run into this problem or know how to fix it?
I have a web form with several "submit" buttons.
One of these uploads a file, and I want to validate the user input
prior to submitting the form. I have an event handler specified with
the form's "onsubmit" attribute which checks the the
event.target.value to make sure the right submission type is being
evaluated.
When I try to get the target or srcElement value from the event
object, however, it is always "undefined".
Here is the cut-down version of the handler...
function validateIfUpload() {
if (window.event) {
evt = window.event
} else if (document.event) {
evt = document.event
}
if (evt.target) targ = evt.target
else if (evt.srcElement) targ = evt.srcElement
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode
if (targ.value == "Upload") {
return validateUpload('prod_img_f')
}
return true
}
I'm having an issue with CSS, JS and the DOM. It's gonna drive me batty. I
am trying to access the properties of a layer in JS which have been
initially set in an external CSS. The problem is that for some reason JS
isn't receiving NULL for all the properties of the layer. For instance:
HTML
<div id="blarg">.....</div>
JS
var t = document.getElementById("blarg").style.left;
CSS
#blarg{
position: absolute;
left: 200px;
}
t == NULL and I can't figure out why. It is this way for any CSS attribute
I attempt to read (width, positional, the whole kit and caboodle).
It does work if I set the attribute in JS before I read it.
JS
document.getElementById("blarg").style.left = 30;
var t = document.getElementById("blarg").style.left;
t now == 30. The only thing I can think of to explain this is that when
the document gets loaded my layers aren't getting their attributes filled
out. The object gets created and the attribute fields are blank until I
fill them in. Thusly my creation of CSS's was a waste of time. Grr...
Any ideas/suggestions? Google has been of no help. :-( This is occurring in
IE 6, and the gecko engine browsers.
While trying out some of the code given in the book, I found that passing CSS properties and values in the jQuery is not working somehow. Following is what I have written.
$(document).ready(function() {
$('#first tbody tr:even').css('background-color': '#dddddd',
'color': '#666666',
'font-size': '11pt',
'line-height': '2.5em');
});
Where as if Ipass CSS properties infollowing way, it is working. But I would need to write multiple statements for that. $('#first tbody tr:even').css('color', '#873450');
If I have the following hyperlink :
<p><a href='page.htm' id='foo' class='bar' alt='alt text'>click</a></p>
I know that I can get (eg) the href attribute via $('a').attr('href') BUT I would like to do the following :
get *all* the attribute names and values without knowing anything about the attribute names and values in advance (or even how many there are) - something like a loop and $('a').(attribute name, attribute value). I suppose they would best be placed in a JavaScript object as a set of name/value pairs eg { href: 'page.htm', id: 'foo', alt: 'alt text' }