...

View Full Version : jQuery Transfering to datastring.



CoolAsCarlito
12-02-2010, 05:38 PM
I'm trying to figure with my li.data( 'characterid', characterid ); line how to send it to the datastring for processing. I don't know how its impacted by the fact that there could be muliple values for this bit of data. Any tips?


<?php

// Include the database page
require ('../inc/dbconfig.php');

?>
<script type="text/javascript">
$(document).ready(function() {
$('div.message-error').hide();
$('div.message-success').hide();
$('ul#characterlist').css( 'margin-left', '120px' );
$('li').remove('.characterName');
$("input.submit").click(function() {
$('div.message-error').hide();
var username = $("input#username").val();
if (username == "") {
$("div.message-error").show();
$("input#username").focus();
return false;
}
var password = $("input#password").val();
if (password == "") {
$("div.message-error").show();
$("input#password").focus();
return false;
}
var firstname = $("input#firstname").val();
if (firstname == "") {
$("div.message-error").show();
$("input#firstname").focus();
return false;
}
var lastname = $("input#lastname").val();
if (lastname == "") {
$("div.message-error").show();
$("input#lastname").focus();
return false;
}
var email = $("input#email").val();
if (email == "") {
$("div.message-error").show();
$("input#email").focus();
return false;
}
var status = $("select#status").val();
if (status == "") {
$("div.message-error").show();
$("select#status").focus();
return false;
}
var admin = $("select#admin").val();
if (admin == "") {
$("div.message-error").show();
$("select#admin").focus();
return false;
}

var dataString = 'username=' + username + '&password=' + password + '&firstname=' + firstname + '&lastname=' + lastname + '&email=' + email + '&status=' + status + '&admin=' + admin + '&submithandler=True';
$.ajax({
type: "POST",
url: "processes/handler.php",
data: dataString,
success: function() {
$('div.message-error').hide();
$("div.message-success").html("<h6>Operation successful</h6><p>Handler " + firstname + lastname + " saved successfully.</p>");
$("div.message-success").show().delay(10000).hide("slow");
$(':input','#handlerform')
.not(':submit')
.val('')
return true;
}
});
return false;
});
});

</script>
<!-- Form -->
<form action="#" id="handlerform" method="POST">
<fieldset>
<legend>Add New Handler</legend>

<div class="field required">
<label for="username">User Name</label>
<input type="text" class="text" name="username" id="username" title="User Name"/>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="password">Password</label>
<input type="password" class="text" name="password" id="password" title="Password"/>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="firstname">First Name</label>
<input type="text" class="text" name="firstname" id="firstname" title="First Name"/>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="lastname">Last Name</label>
<input type="text" class="text" name="lastname" id="lastname" title="Last Name"/>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="email">Email</label>
<input type="text" class="text" name="email" id="email" title="Email"/>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="status">Status</label>
<select class="dropdown" name="status" id="status" title="Status">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, statusname FROM statuses';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['statusname']."</option>\r";
}
?>
</select>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
<div class="field required">
<label for="admin">Administrator</label>
<select class="dropdown" name="admin" id="admin" title="Administrator">
<option value="0">- Select -</option>
<?php
$administrator = array('Yes', 'No');
foreach($administrator as $admin):
?>
<option value="<?php echo $admin; ?>"><?php echo $admin; ?></option>

<?php endforeach; ?>
</select>
<span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span>
</div>
</fieldset>
<fieldset>
<legend>Handler's Characters</legend>
<div class="field">
<label for="charactersdrop">Characters</label>
<select class="dropdown" name="charactersdrop" id="charactersdrop" title="Characters Dropdown">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, charactername FROM characters ORDER BY charactername';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['charactername']."</option>\r";
}
?>
</select>
<input type="button" value="Add Character" class="" onclick="HandlerCharacters()"/>
<ul id="characterlist"></ul>
</div>
<input type="submit" class="submit" name="submithandler" id="submithandler" title="Submit Handler" value="Submit Handler"/>
</fieldset>
</form>
<!-- /Form -->

<!-- Messages -->
<div class="message message-error">
<h6>Required field missing</h6>
<p>Please fill in all required fields. </p>
</div>

<div class="message message-success">
<h6>Operation succesful</h6>
<p>Handler was added to the database.</p>
</div>
<!-- /Messages -->


<script type="text/javascript" language="javascript">
// Long version
function HandlerCharacters() {
function isDupe(which) {
var result = false;
$('ul#characterlist li').each(function(i, e) {
if ($(e).data('characterid') == which) {
result = true;
return false; // break out of .each()
}
});
return result;
}
var characterid = $('#charactersdrop option:selected').val();
var characterName = $('#charactersdrop option:selected').text();

if (characterid > 0 && !isDupe(characterid)) {
// Create the anchor element
var anchor = $( '<a href="#">Remove</a>' );

// Create a click handler for the anchor element
anchor.click( function() {
$( this ).parent().remove();
return false; // makes the href in the anchor tag ignored
} );

// Create the <li> element with its text, and then append the anchor inside it.
var li = $( '<li>' + characterName + '&nbsp;</li>' ).append( anchor );
li.data( 'characterid', characterid );

// Append the new <li> element to the <ul> element
$( '#characterlist' ).append( li );
}
}
</script>

Zefris
12-03-2010, 04:47 AM
I don't completely remember, but I think the selected option values gets sent to the server as a comma separated string if it were submitted without AJAX. Perhaps you can build your string that way. ;o

On another note, you may want to use "encodeURI()" on your values before submission.

CoolAsCarlito
12-03-2010, 10:50 PM
Huh? That confused me.

CoolAsCarlito
12-04-2010, 04:55 PM
I was hoping out of 126 possible reads more than 1 person would comment with something.

CoolAsCarlito
12-06-2010, 02:56 AM
This thread has been solved since it won't let me edit it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum