Search jQuery

jQuery Forum

Screen name:
Shimon

Shimon's Profile

4 Posts

2 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

How to pass a google map object from a client to server
[3Replies]
- 12-Nov-2013 08:24 PM
- Forum: Using jQuery
I have developed an application that creates a customl overlay for google maps. The basic idea is that a client through an api would send my server a google map object. My application would add the overlay and send the map back to the client.

For the last several days I have been trying to work out how to pass this object to the server without success. I have an api that works with text. So once I am able to pass this object I can change the api.

The object is created in the statement:

map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);

I intend on passing it via the $.ajax call which is incomplete(and incorrect) in the code which follows as mentioned I have not been able to discover a way to pass it. If anyone can at least point me in the correct direction it would be appreciated.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<title>Send Map</title>
<style>#map-canvas {height: 500px;width: 500px;}</style>

<script>
function initialize()
{
$longitude = -111.6608;
$latitude = 40.2444;
myLatlng = new google.maps.LatLng($latitude,$longitude);
mapOptions =
{
zoom: 11,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.TERRAIN
};

map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);

$.ajax(
{
// incomplete here.. convert map object?
url: "localhost/api/?Map=map",
})
.done(function( Updatedmap )
{
// do stuff
});
}

}
google.maps.event.addDomListener(window, 'load', initialize);

</script>

</head>
<body>
<h1>Send Map</h1>
<div id="map-canvas"></div>
</body>
</html>

jquery form validation label has multiple classes - valid, error, valid!!!
[0Replies]
- 10-Oct-2013 01:58 AM
- Forum: Getting Started
Since making the post below I obtain a little more information, it turns out that the label created during validation has 2 classes - error and valid and the input tag has a class=valid as well!!! Go figure.

Using Chrome developer tools the following code is the result after validation:

<label for="station">Station: </label>
<input type="text" id="station" name="station" maxlength="7" class="valid">
<label for="station" class="error valid"></label>

Original post -

I read great things about this plugin. I just wish I could be a member of those having success with it! I have been working ALL DAY on being able to validate radio buttons and use the remote rule. Frustration would be an improvement of my mood. Hopefully, someone will assist me in getting on the right track.

OK, I have a very simple piece of code that all it does is validate a text field. When that is all there is, it works fine. When I add a remote rule it does not validate until I press the submit button and the alert telling me the form is submitted does not show. In addition, if I click anywhere else on the page (change focus) the text field is not validated when the remote rule is used. This occurs when the return value of the remote call is "true", when the return is "false" nothing at all happens until I press the submit button, and it shows the text field as being validated instead of an error!

Thank you in advance for your patience and assistance,
Shimon

Here is the code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Research by Call Sign</title>

<style>

label, #station
{
margin-left:5px;
float: left;
}

input
{
border: 1px solid black; margin-bottom: .5em;
}

input.error
{
border: 1px solid red;
}

label.error
{
background: url('images/unchecked.gif') no-repeat;
padding-left: 16px;
margin-left: 10px;
}

label.valid
{
background: url('images/checked.gif') no-repeat;
display: block;
width: 16px;
height: 16px;
}

</style>

</head>
<body>

<form id="myform">
<label for="station">Station: </label>
<input type="text" id="station" name="station" maxlength="7" />
<br /><br />
<input type="submit" value="Submit">
</form>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script src="http://jquery.bassistance.de/validate/additional-methods.js"></script>
<script>
// just for the demos, avoids form submit
jQuery.validator.setDefaults(
{
debug: true,
success: "valid"
});
$( "#myform" ).validate(
{
rules:
{
station:
{
required: true,
// When "remote" is added nothing works as it should... "check-callsign.php" only returns "true"
remote: "check-callsign.php"
},
},
messages:
{
station: "Call Sign NOT FOUND"
},
// specifying a submitHandler prevents the default submit, good for the demo
submitHandler: function() {
alert("submitted!");
},
});
</script>

</body>
</html>

the code for "check-callsign.php" is as follows:

<?php

echo "true";
?>

Success checkmark in Remember the milk demo does not work properly
[2Replies]
- 09-Oct-2013 01:26 AM
- Forum: Getting Started
The jquery validation is a great tool. I recently downloaded it and began working with it. The Remember the Milk demo is a nice piece of work. However, there is one thing I have a problem with. I have not changed any of the code, but it seems that the radio buttons will only validate AFTER the submit button is pressed thereby getting an error message on any field (or at least the success checkmark only shows up after an error is made on the form).

I have looked through all the questions, answers, and documentation but fail to see where the problem is. Anyone that can clarify the issue here or point me in the right direction would be appreciated.

again, thanks in advance,
Shimon

jquery remote validation
[0Replies]
- 05-Oct-2013 07:54 PM
- Forum: Using jQuery Plugins
I have been using this plugin and have run across a curious problem. When I use the following code, all works just fine:

<script>
$(document).ready(function()
{
// validate signup form on keyup and submit
var validator = $("#signupform").validate(
{
rules:
{
email:
{
required: true,
email: true,
remote: "check-email.php"
},
username:
{
required: true,
minlength: 2,
remote:
{
url: "check-vCode.php",
}
},
},
messages:
{
email:
{
required: "Please enter a valid email address",
remote: jQuery.format("email not found")
},
username:
{
required: "Enter Validation COde",
minlength: jQuery.format("Enter at least {0} characters"),
remote: jQuery.format("Code does not match")
},
},

// set this class to error-labels to indicate valid fields
success: function(label)
{
// set   as text for IE
label.html(" ").addClass("checked");
},
highlight: function(element, errorClass)
{
$(element).parent().next().find("." + errorClass).removeClass("checked");
}
});

});
</script>

However, when I add this code (in bold), the code no longer functions and check-vCode.php never gets called:
<script>
$(document).ready(function()
{
// validate signup form on keyup and submit
var validator = $("#signupform").validate(
{
rules:
{
email:
{
required: true,
email: true,
remote: "check-email.php"
},
username:
{
required: true,
minlength: 2,
remote:
{
url: "check-vCode.php",
```
                         type: "post",
                         data:                                {
                         email: function()                                   {
                         return $( "#email" ).val();
                         }                                }
```
}
},
},
messages:
{
email:
{
required: "Please enter a valid email address",
remote: jQuery.format("email not found")
},
username:
{
required: "Enter Validation COde",
minlength: jQuery.format("Enter at least {0} characters"),
remote: jQuery.format("Code does not match")
},
},

// set this class to error-labels to indicate valid fields
success: function(label)
{
// set   as text for IE
label.html(" ").addClass("checked");
},
highlight: function(element, errorClass)
{
$(element).parent().next().find("." + errorClass).removeClass("checked");
}
});

});
</script>
check-vCode.php only returns "false" (testing for now)

I appreciate any assistance.
thank you,
Shimon

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend