Hopefully someone can help me here.
I have a page that displays a list of users in a modal popup. This page can be accessed in two ways, one way you choose Unapproved users and it will open the page, the other way you choose user accounts which will open a popup asking if you have any search criteria such as name, once you have finished there you search and it brings up the page of users.
I have a button on the form to clear any filters. When i run it on the Unapproved users page, it clears the box fine, however if i do it on the form from the other way the code will not empty the textbox and when i try an alert it shows no data. Where as the alert works on the Unapproved route!
Here is the jquery that i am using:
clear: function () {
//reset filters//
$('.usersFilterList li').remove();
$('.userFilterSelect option').show();
$('#UserFilter_SearchTermIncluded').attr('value', ''); // This line doesn't seem to work properly
alert($('#UserFilter_SearchTermIncluded').attr('value'));
//hide filter options
MSG.showNHide('', '#usersFilterBox');
//reset modal control buttons
$('#usersButSaveFilter,#usersButClearFilter').hide();
$('#usersButFilter').fadeIn();
usersFilter.refresh(0);
}
Can anyone see if i am doing anything stupid? As i say, it is exactly the same form called from the same MVC action just with the other popup in between.
Apologies if this is confusing, I cannot post anymore code i am afraid. I can assure you that the ID of the textbox is correct though.
Any advice here would be much appreciated as I have been staring at it for hours now...
Cheers,
Gareth
If i right click the second option and run in new tab and run that first pop up as a full page the code will then work! So the problem appears to be that there are two popups.
SOLVED
I found a work around of my own, thanks for all your help.
I simply assigned a class and searched for any items with that class and cleared it like so:
$('.jq-clearme').val('');
I will close this when i can. I am not allowed yet due to my rep being too low.
To change the value of an element (or to retrieve it), accessing the attribute is the wrong way to go - it's not synchronized in both directions. What you want is the property. While also exposed through .prop('value'[, newvalue]) the correct way to get/set it with jQuery is .val([newvalue]).
To clear the element's value use the following:
$('#UserFilter_SearchTermIncluded').val('');
To retrieve/show it, use
alert($('#UserFilter_SearchTermIncluded').val());
You should use val() to get/set the value of the input.
Use without a parameter to get the value:
$('#UserFilter_SearchTermIncluded').val();
And with a paramater set the value, in this case set it to nothing:
$('#UserFilter_SearchTermIncluded').val('');
Is there an ajax call involved which might be loading the Javascript you posted twice and hence when called the second time (after the ajax call) it finds a conflict?
As mentioned by others best to use .val('') to set a value and .val() to get the value. Check in firebug if there are any Javascript errors.
I found a work around of my own, thanks for all your help.
I simply assigned a class and searched for any items with that class and cleared it like so:
$('.jq-clearme').val('');
I will close this when i can. I am not allowed yet due to my rep being too low.
Related
Taking JavaScript this semester. I cannot grasp how this property can be useful at all. This property gives a Boolean value of true IF the checked attribute was used in tag for the check box object...BUT if I am the one writing the program ...I should know if I wrote that into the program correct? I just do not see the logic in this property. Anybody have a better reason for the use of it?
First, to answer your question, "Don't I know?". Of course not. If you are thinking of a form that is only used to add records, I could see your point but forms are also used to update records and we have no idea what the initial value is for any given record that may need to be updated.
The next thing to understand is that the same concept applies to more than check boxes. For example the text input elements have a "defaultValue" property that parallels the logic of default checked property.
The next point, is these properties would be better understood by novices had they been named "initialxyz" rather than "defaultxyz". Novices think that they are used to identify what should be sent to the server if not populated by the user but that is not what they are at all. They are the initial value, as sent by the server to the client, before the user starts interacting with the screen.
To answer your larger question, these propertied are extremely useful in two cases. The first has already been mentioned which is the "reset" button or as I jokingly call it the "oops" button or "start over". That can occur at the record level that resets every element on the form but it can be used on a field by field basis where only the field that has focus is reset. For example, the escape key is often used for this purpose. The second use for this is to know if the form is "clean" (unchanged) or dirty (changed, in at least one small way somewhere). This is used in too commentary places that you did not think about. The first is to avoid submitting a form with no changes to the server. Why waste resources. The complementary is to pop up the "are you sure you want to lose your changes" when someone attempts to navigate away from a form with changes. You walk the form and compare the current valued to the initial value for each element. If no elements changed the form is clean and allow the user to leave without a prompt. If at least one element is different than it's initial value and take appropriate action which might be to prompt to confirm leaving or it might be to submit the form changes to the server before leaving or something that neither of us have thought of yet.
Hypothetically, you might have a form with lots of fields written in html, and you may want to have a "reset" button which resets all of the form fields back to their initial values. (I don't really know why that used to be a common form button, I've never seen a use for it...) The code to reset checkboxes would then be:
input.checked = input.defaultChecked;
which would be the same for all checkboxes, and then you wouldn't need to track the difference between default checked and no default checked ones separately.
Really though, it doesn't appear to have much use, and I've never used it before.
One scenario would be when you are creating checkboxes dynamically, on-the-fly, in your code. The creation may be dependent on a couple of parameters, some of them depending in turn on selections by the user, from the current screen/page.
You may wish to set what is the state of these newly created checkboxes by default, before the user performs any actions on them.
Exemplifying: Say you have a textbox where the user has to tell you how many new checkboxes you should create for whatever further actions. Then after the user enters the input, your javascript creates N checkboxes, accordingly. And their initial state is set according to "defaultChecked".
Just yesterday I found myself using this same attribute. It comes in very handy when trying to set certain values to default.
Have you ever signed up for something ad then found yourself receiving TONS of unwanted newsletters? or you install one thing and two more things start installing? This happens because there was an option somewhere with a checkbox that had the checked attribute to make that decision for you.
Mostly it is used to make decisions for the user. Comes in handy sooner than later!
BTW: Welcome to the sweet world of JavaScript!
I have a form with a read only field for display/submit to the next page purposes.
However, I noticed using developer tools in Chrome, I was able to add an id to an element, use the javascript console to select that element, and change its value. I submitted the form and what do you know - the next page acted on it as if it was the original value.
Now, there shouldn't be any problem with the people using the site I'm building, but it seems like a huge security flaw to me. Isn't the point of read-only to remain constant? If a savvy user to change it around, doesn't that pose a big problem? In fact, I didn't even think you could add and change attributes in chrome.
Please post your thoughts below, and let me know if there's a solution ("disabled" textfield, but setting the disabled property doesn't send the data to the next page).
NEVER trust input from a web form.
The user could, just as easily, remove the readonly attribute and edit the value. The readonly attribute is only something to help the user when filling out the form, so they don't edit a value expecting it to change, when your server actually won't let it be changed. So, always remember to code the behavior on your server first, and have the HTML form be a helpful guide for users to make the form easier to fill out (without having to submit the form several times to get relevant error messages).
To overcome this, if something is readonly and you do not want it edited, you could store the value in your database. Also, values provided by users should always be checked (and sanitized) as no amount of JavaScript, HTML, or CSS is going to prevent someone who knows what they're doing from adding new or changing/removing existing values.
When a user creates an account on certain sites, it sometimes require the user's basic information such as name, email, and location. Chrome has the ability to autofill this form if the user had previously entered his/her information.
My question is: is it possible to detect/identify whether the page the user is visiting can be autofilled?
A naive solution would be to parse every page for forms that can be autofilled. But is there a more elegant solution?
What do you want exactly? Every form CAN be autofilled, obviously, so the answer is YES to the question in your text.
The question in your headline is a much different one - HAS the form been auto-filled?
There is a pretty good approximation: if you check on load if there are any values in the form (that differ from the ones you sent), and there are, the user can't have filled them manually, obviously. So then you know that auto-fill has taken place.
On the other hand, it almost sounds as if you are looking for a generic solution not for your own site but for a browser extension you yourself want to write? In that case the solution is the same though, immediately on page load look at the values the page provides and see if the ones actually there differ. I'm not exactly sure, but the onload event should be fine, I think autofill doesn't happen before the page has loaded. Maybe you'll even need to add a few hundred milliseconds on top of the onload event. The user can't type much anyway in less than a second, or select checkboxes etc., so it's still a very good guess.
Anyway, even after re-reading your headline and your question I'm actually MORE confused about what exactly you want to achieve - but as Douglas Adams wasn't the first one to try to teach us, often it's not the answer but the question itself that is the problem :)
well, you can check for the default value value="VALUE" has changed
i.e:
if (getElementById('inputID').value != 'VALUE') { // DO SOMETHING }
or
check if value has changed:
input type="text" onchange="alert('changed')">
one of these two should help you ( i hope :) )
You could use
document.querySelectorAll('*:-webkit-autofill');
to get all elements autofilled.
Then you just have to check if any new elements is in there in a loop.
I'm fairly new to Javascript. I'm trying to write a pretty basic program that will display the results of a form in a popup window after being submitted by the user.
I've got a form with all the relevant IDs. My problem is accessing this form from within the popup window. I've been playing around with window.opener.formid1, window.parent.formid2, document.forms[0] changing values where necessary, trying anything my countless searches have returned, but all I seem to get are "undefined" errors. I tried defining my variables in several different places but after a lot of testing I'm getting nowhere.
I'm aware you can use, for example
var popup = window.open("popup.html")
popup.document.write('')
which works fine but I don't want to overwrite the contents that are already in there and unless I'm mistaken, there isn't a way to append or edit a file.
If someone can offer a solution or any feedback, it'd be much appreciated. Thanks.
Have you tried: popup.document.getElementById('formID').appendChild. I beleive that should work.
If I understand it correctly, you are trying to submit your form and want to display the result in a new pop up.
If you want to submit your form and want to get the response use the AJAX which is again javascript. You can get AJAX examples from google for your assistance.
As you have already mentioned, writing on popup or sending value to the popup (may be through query string) would work after you receive the result from AJAX request.
From the popup, the following should work:
var form = window.opener.document.getElementById('formid1');
// Get data from form here.
I have a label, let's call it LblA. I have a SqlDataSource, let's call it sds. Now, I have selected out and managed to get specific values using the select function. I want to set LblA's text to the value selected out of sds. I need this to occur every 5 (or as many as I specify really) seconds. I orignally used a timer object, however, for any of you who have used the timer object before, it likes to refresh the page, this makes it very hard to navigate off of the page; not only that, it's sloppy. Does anybody know a way to easilly update LblA's text from sds without refreshing the actual page.
I've read around and came to the conclusion that I need to use ajax, err... jQuery. However, I really don't know anything about the two except that they are both Javascript libraries? I need a simple way, you might even have to explain it to me like I'm an idiot.
I'm using VB.net and ASP.net just so you know.
Thanks so much!
If you want it simple use UpdatePanel If you want more control and efficiency, use jQuery's Content