I'd like to block all characters from being inputed except 0-9,a-z,A-Z range only alphanumeric characters. So when someone types ! for examplee nothing is written into input. How can I do that?
url = "http://example.com"
new Ajax.Request(url, {
onComplete: function(transport) {
alert(transport.status);
}
});
I'd like that to return a status of 200 if the site is working, or 500 if it is not working, etc.. But that code is returning 0 all the time.
Ultimately, I want to have a setinterval function that regularly pings a website for uptime status.
I’m new (only two weeks old) in Jquery, so please bear with me.
I know that a very similar question was asked some time ago
but I do not know how to adapt the answer to my problem.
I have a very wide multicolumn layout something like this:
| aaaa | bbbb | cccc | … |
| aaaa | b | cc | … |
| aaa | cccc | ddd | … |
The code looks like:
<div id="container">
<p>aaaaaaaaaaa</p>
<p>bbbbb</p>
<p>ccccccccccc</p>
<p>dddddddddd</p>
...
<p>xxxxxx</p>
</div>
There is no vertical scrolling and the container width
is set in such a way that only two columns are shown.
The user scrolls left or right to see the relevant text.
What I want is to get the position currently on display,
store it (maybe in a cookie) and retrieve it the next
time the user opens the page.
I think that I need a way of finding out what paragraph
is currently the left-top most, but other suggestions
are very welcome.
Any ideas?
btw: this is an internal project, so Mozilla only :-)
Thanks
Lolo
I have a div fading in using fadeTo. It works great in Firefox and IE9. It does not work in IE8. Here is my code:
JS:
var $j = jQuery.noConflict();
window.onload = function(){
$j('#fadein').fadeTo(6000, 1, function() {
});
};
HTML
<div class="img-center" id="fadein" style="opacity:0;">
<img src="src.jpg" alt="Text" class="feature-image" />
</div>
How do I get this to work in IE8? I do not mind changing from fadeTo to fadeIn or some other method of fading in a div as long as it works in IE8.
I know its been asked many times already but no one could come up with solution so far.
The idea is to have one form separated into few steps and validate each step on next click of the button. I know jquery validation plugin is offering quite complicated way of doing it with accordion but can anyone come up with a simple solution something like
var stepOne = {
rules: {
fieldname1: "required",
fieldname2: "required",
}
}
$("form").validate(stepOne); //onclick
hope someone could suggest the best way of doing it.
Thanks.
function VisibleDiv(obj) {
if (obj == BaseLog) {
var objStyle = document.getElementById('DivCalls').style;
if (objStyle.display == "block")
objStyle.display = "none";
else
objStyle.display = "block";
}
else if (obj == ViewReports) {
var objStyle = document.getElementById('DivReports').style;
if (objStyle.display == "block")
objStyle.display = "none";
else
objStyle.display = "block";
}
else if (obj ==Management) {
var objStyle = document.getElementById('DivManage').style;
if (objStyle.display == "block")
objStyle.display = "none";
else
objStyle.display = "block";
}
<a href="#" id="BaseLog" class="TextHeader" onclick="VisibleDiv(this)">Base Log </a>
in the above code is working in IE but not working in mozilla 3.6.
I have checked that obj==BaseLog is not working in the above code.
I have tried many options like
event.srcelement
window.event.srcelement
but all in vain.
when I debug the code ,I found that obj is having complete value for IE but
the same obj is having all the names .ie. the name of tag,id and class for "Base Log" seperated by #. i.e a#BaseLog#TextHeader#
Please suggest what shoud I do?
Hi to all. I'm trying to optimize a website. The flow is i tried to query a certain table and all of its data entry in a page(w/ toolbars), work fine. When i tried to edit the page the problem is when i click the checkbox button i have to wait 2-5sec just by clicking it. I limit the viewing of entry to 5 only but the response on checkbox doesn't change. The tables have 100 entries in them.
function checkAccess(celDiv,id)
{
var celValue = $(celDiv).html();
if (celValue==1) $(celDiv).html("<input type='checkbox' value='"+$(celDiv).html()+"' checked disabled>")
else $(celDiv).html("<input type='checkbox' value='"+$(celDiv).html()+"' disabled>")
$(celDiv).click
(
function()
{
$('input',this).each(
function(){
tr_idx = $('#detFlex1 tbody tr').index($(this).parent().parent().parent());
td_idx = $('#detFlex1 tbody tr:eq('+tr_idx+') td').index($(this).parent().parent());
td_last = 13;
for(var td=td_idx+1; td<=td_last;td++)
{
if ($(this).attr('checked') == true)
{
df[0].rows[tr_idx].cell[td_idx] = 1;//index[1] = Full Access
if (td_idx==3)
{
df[0].rows[tr_idx].cell[td] = 1;
}
df[0].rows[tr_idx].cell[2] = 1;
if (td_idx > 3)
{
df[0].rows[tr_idx].cell[2] = 1;
}
}
else
{
df[0].rows[tr_idx].cell[td_idx] = 0;//index[0] = With Access
if (td_idx==2)
{
df[0].rows[tr_idx].cell[td] = 0;
}
else if (td_idx==3)
{
df[0].rows[tr_idx].cell[td] = 0;
}
if (td_idx > 3)
{
df[0].rows[tr_idx].cell[3] = 0;
}
}
}
$('#detFlex1').flexAddData(df[0]);
$('.toolbar a[title=Edit Item]').trigger('click');
});
}
);
}
I've thought that the problem is this above code. Could anyone help me simplify this code.?
I can see how buffers, and strings can be sent as chunks, but I'm having a problem thinking about how streams can be dealt when working in object mode.
Say I have a byte stream from an http request message. I want to take that message, parse, and then transform it into one big object.
I already know how to parse the message. What I'm wondering is if the message is big so it has many chunks, but I want to make one object for the output how can I make sure the data event waits for the whole thing?
Is this just a matter of not using the push method until the chunked data has finished being sent?
That would then restrict the stream data output to a smaller object which I think I'm fine with for now.
As an added condition the larger data will be reduced in size after the the transform.
Right now, the text seems not to be exactly vertical centered.
It seems that there is more top-padding than bottom-padding.
Although of course, there is no padding in the CSS. How do I make this completely vertical aligned?
I'm stuck in a rut. I hope some one can help.
Basically, I am building an AJAX mobile web app with jQuery. I am able to parse a specific XML file just fine, but I want the option to parse other XML files based on the link they were clicked on and load them on the fly into the same DIV or UL.
So:
click on Link1, loads XML1
click on Link2, loads XML2
I would like to be able to do this all client side, so no PHP (or is that a bad idea?). This the jquery code I've been using:
$(document).ready(function() {
$("a.load_ajax").click(loadAjax());
function loadAjax() {
var fileID = get('?lineID=');
var dataID = "xml/" + fileID + ".xml"
$.ajax({
type: "GET",
url: dataID,
dataType: "xml",
success: parseXml
});
function parseXml(xml) {
$(xml).find("train").each(function() {
$("ul#ajax-output").append('<li>' + $(this).find("time").text() + '</li>');
});
}
}
});
Its just not working at all. I have been passing the variable using GET in the url. So the link in the HTML goes to /?lineID=SBD_to_Union and it should load the XML file called SBD_to_Union.xml
Making sense to anyone? I'd appreciate some help.
I have a snippet of code that alters the contents of a DIV to match the contents of a textarea and then applies the height change in the DIV to the textarea element.
function growTextArea(parameter) {
$('div').find("[data-fieldid='1_description']").text($(parameter).val());
// No Works
height = $('.hiddenDiv').find("[data-fieldid='1_description']").outerHeight();
alert(height);
// Works
heightDiv = $('.hiddenDiv').outerHeight();
alert(heightDiv);
$(parameter).css('height', $('div').find("[data-fieldid='1_description']").outerHeight());
}
The DIV contents change properly, so the search function is working properly, however the search function always returns the original height of the DIV. The function is called by onKeyUp in the textarea. If the .find is swapped out for a .hiddenDiv the height change is reflected properly.
I tried: $('#canvas').append('<div class="tile"></div>').css({left: leftPos, top: topPos});, but that sets the style of #canvas rather than the appended element.
I then tried: $('#canvas').append(('<div class="tile"></div>').css({left: leftPos, top: topPos}));, but that gives the error "Object <div class="tile"></div> has no method 'css'".
How can I add the element and set its style at the same time?
I somehow cannot achieve that the a-tag looses its default action when clicking it:
<a href="#" class="button dismiss">dismiss</a>
$(document).ready(function() {
$('.dismiss').click(function(e) {
e.preventDefault();
$('#output').empty();
$('#MyUploadForm .button').show();
});
});
When I click the button, the browser window scrolls to the top. What is wrong here?
I have a jQuery plugin that overrides link behavior, to allow Ajax loading of page content. Simple enough with a delegated event like $(document).on('click','a', function(){});.
but I only want it to apply to links that are not like these ones (Ajax loading is not applicable to them, so links like these need to behave normally):
target="_blank" // New browser window
href="#..." // Bookmark link (page is already loaded).
href="afs://..." // AFS file access.
href="cid://..." // Content identifiers for MIME body part.
href="file://..." // Specifies the address of a file from the locally accessible drive.
href="ftp://..." // Uses Internet File Transfer Protocol (FTP) to retrieve a file.
href="http://..." // The most commonly used access method.
href="https://..." // Provide some level of security of transmission
href="mailto://..." // Opens an email program.
href="mid://..." // The message identifier for email.
href="news://..." // Usenet newsgroup.
href="x-exec://..." // Executable program.
href="http://AnythingNotHere.com" // External links
Sample code:
$(document).on('click', 'a:not([target="_blank"])', function(){
var $this = $(this);
if ('some additional check of href'){
// Do ajax load and stop default behaviour
return false;
}
// allow link to work normally
});
Q:
Is there a way to easily detect all "local links" that would only navigate within the current website? excluding all the variations mentioned above.
Note: This is for an MVC 5 Razor website, so absolute site URLs are unlikely to occur.
We have developed a page with a asp.net and debugging it accidentally we have discovered on our page button with the next code on onclik attribute
onclick="__doPostBack('ctl00$FormPlace$m_userTaskMarkAsUnreadButton',''); __doPostBack('ctl00$FormPlace$m_userTaskMarkAsUnreadButton','');WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$FormPlace$m_userTaskMarkAsUnreadButton", "", true, "", "", false, false))"
It seems that the button do three postbacks but when we click it only cause on postback. With this code seems that de button will cause three postbacks!!
We have try it with Internet Explorer and Firefox and the button only cause on postback always. Are browsers who avoid that the button do three postback ? Or Is Asp.net server who avoid the three postback? We don't understand why the button behaves correctly if onclick attribute has three call to do Postbacks.
Thanks
Hi guys,
I'm developing a Flash website (as3) where I need to be able to upload directly to YouTube by using the DATA API.
However in order to do so, I had to use a proper HTML form on top of my flash object.
Why? Because of the Browser Based Upload restictions.
I first hide the form using JQuery and with a little CSS the form is display just where I want it.
Within flash I use ExternalInterface.call() to show/hide the form when I need it!
ExternalInterface.call("YTUploader.showIt");
The upload process is working great my only problem is that the form can be displayed easily...
You just need a tool like firebug and you can use the form wherever you want on my flash app.
So I was wandering which will be the best way to 'protect' this form or the best way to limit its access.
Any advices will be appreciated.
Thanks for your time.
Jk.
I'm creating a website using node.js. I have seen many libraries mentioned that piggy back on top of imagemagick etc. There is a list here: https://github.com/ry/node/wiki/modules#graphics
What I'm trying to do is take the image that a user uploads, crop it/size it to certain dimensions the site requires. What is the best/most active script to do this? I'd like one with npm support. Does anyone have actual experience using some of these?
I have a function which can be called by either a click event or directly. When I call it directly, I need pass it a data parameter, so I've defined the function to accept a parameter to account for the direct call with the parameter.
function myFunc(param){
}
Within the function, I need to differentiate whether the function was called directly or from the click event, so what I thought I could simply check if param is set. If it's set, then the function is called directly. If it's not set, then it's called from the click event.
The problem is that a click event by default passes an event object. So even when the function is called by the click event, param won't be null.
So is there a way to check whether the param passed is the click event?
I don't know much about jquery at all, so bear with my ignorance, but I'm pretty sure I can accomplish this with jquery.
I need jquery to check if an element exists, and if so, add a class to a different element. For example,
if class "minimal-price-link" exists, then add a class to "regular-price" or what I really am wanting to do is make the regular-price strikethrough.
Here's the code:
<div class="price-box">
<span class="regular-price" id="product-price-2">
<span class="price">$240.00</span>
</span>
<a href="http://stemulation.com/order/sfs30.html" class="minimal-price-link">
<span class="label">Your Price:</span>
<span class="price" id="product-minimal-price-2">$110.00</span>
</a>
</div>
I refresh pages by writing window.location = window.location; however this doesnt work on a page like /page#c22. It will just jump to whereever c22 is. How do i refresh the page? It does not need to use go to #c22 once refreshed but i am sure there is a more dependable way then window.location = window.location
Round two. First was "How do I get all supported CSS properties in WebKit?".
I'm looking for magic CSSkeywords function:
CSSkeywords('float') --> ['left', 'right', 'none']
CSSkeywords('width') --> ['auto']
CSSkeywords('background') --> [
["repeat", "repeat-x", "repeat-y", "no-repeat"],
["scroll", "fixed"],
["top", "center", "bottom", "left"],
/*regexp for color*/,
/*regexp for url*/,
"none"
]
Hi,
I have a couple of UI elements such as buttons in my web application. I was going to use CSS3's transitions to animate the transition from one background-image to another. I figured out that it's not possible with the current transitions draft at least. So, I was wondering if it would make sense to use Canvas as the button. I'm sure it can handle events, so, I see no problems here. Are there any?
I've edited this piece of code from the Data Tables Plugin witch makes a tr click able and pops open another tr with details from the clicked tr. This piece of code is the event listener for opening and closing. When "details" are open the img should be images/details_close.png and they are closed the img should be images/details_open.png and have a swap occurring when it opens and closes when clicked. What is happening is there is no swap going on when its open or closed I still only get the "details_open.png". I don't knoe if I'm just not selecting the img tag properly or whats going on.
Link to project:
http://www2.kent.k12.wa.us/ksd/it/www/mobile/elementary.html
$('#example tbody').on('click', 'td', function (e) {
var myImage = $(this).find("img");
var nTr = $(this).parents('tr')[0];
if ( oTable.fnIsOpen(nTr) )
{
/* This row is already open - close it */
myImage.src = "images/details_open.png";
oTable.fnClose( nTr );
}
else
{
/* Open this row */
myImage.src = "images/details_close.png";
oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
}
} );