mirror of
https://github.com/sstent/node.git
synced 2026-01-25 14:42:00 +00:00
78 lines
3.9 KiB
Plaintext
78 lines
3.9 KiB
Plaintext
!!!
|
|
html
|
|
head
|
|
title= title
|
|
link(rel='stylesheet', href='/stylesheets/style.css')
|
|
script(src='http://code.jquery.com/jquery-1.6.1.min.js')
|
|
script(src='/socket.io/socket.io.js')
|
|
script
|
|
//$(document).ready(function() {
|
|
|
|
var socket = io.connect('http://localhost:3000');
|
|
|
|
socket.on('populate', function(data) {
|
|
var out = "";
|
|
$.each(data, function(i, obj) {
|
|
|
|
out += "<li>"+obj.name+" is making "+obj.salary+"</li>";
|
|
});
|
|
$('#employees').html(out);
|
|
});
|
|
$(function() {
|
|
//Add more fields dynamically.
|
|
$('.AddNeut').click(function() {
|
|
var field = $(this).attr('data-field')
|
|
var area = $(this).attr('data-area')
|
|
var limit = $(this).attr('data-limit')
|
|
console.log('vars' + field + ',' + area + ',' + limit);
|
|
//var field_area = $('#' + area);
|
|
//var all_inputs = field_area.getElementsByTagName("input"); //Get all the input fields in the given area.
|
|
//Find the count of the last element of the list. It will be in the format '<field><number>'. If the
|
|
// field given in the argument is 'friend_' the last id will be 'friend_4'.
|
|
var last_item = $('#' + field + ' li').length;
|
|
console.log('last_item' + last_item);
|
|
console.log('new_item' + (last_item + 1));
|
|
//If the maximum number of elements have been reached, exit the function.
|
|
// If the given limit is lower than 0, infinite number of fields can be created.
|
|
// if(count > limit && limit > 0) return;
|
|
|
|
// if(document.createElement) { //W3C Dom method.
|
|
// var li = document.createElement("li");
|
|
// var input = document.createElement("input");
|
|
// input.id = field+count;
|
|
// input.name = field+count;
|
|
// input.type = "text"; //Type of field - can be any valid input type like text,file,checkbox etc.
|
|
// li.appendChild(input);
|
|
// field_area.appendChild(li);
|
|
// } else { //Older Method
|
|
// field_area.innerHTML += "<li><input name='"+(field+count)+"' id='"+(field+count)+"' type='text' /></li>";
|
|
// }
|
|
|
|
// create the new element via clone(), and manipulate it's ID using newNum value
|
|
var newElem = $('.' + area + '_template').clone().attr('class',area);
|
|
// var newElem = $('#' + area + last_item ).clone().attr('id', area + (last_item + 1));
|
|
|
|
// newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);
|
|
|
|
////manipulate the name/id values of the input inside the new element
|
|
// newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);
|
|
|
|
////insert the new element after the last "duplicatable" input field
|
|
$('#' + area + 'target').after(newElem);
|
|
// $("."+classname+"#input" + newNum).css('display', 'block');
|
|
|
|
|
|
//return false;
|
|
});
|
|
|
|
$('#save').click(function() {
|
|
socket.emit('data', $('#myForm').serializeArray());
|
|
console.log($('#myForm').serializeArray());
|
|
// to prevent the page from changing
|
|
return false;
|
|
});
|
|
|
|
|
|
});
|
|
|
|
body!= body |