issues with autocomplete inputs values - javascript

I"m trying to replace the values but always gets "undefined".
working
ids[0] = "n";
not working:
ids[0] = "nesya";
The full code here:
<body>
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<form name="form1" method="post" action="">
<p>ids <input type="text" id="ids" name="id" class="ui-autocomplete-input" autocomplete="off"></p>
<p>use <input type="text" id="use" name="username" class="ui-autocomplete-input" autocomplete="off"></p>
<p>ful <input type="text" id="ful" name="full_name" class="ui-autocomplete-input" autocomplete="off"></p>
</form>
<script type="text/javascript">//<![CDATA[
var ids = new Array();
var use = new Array();
var ful = new Array();
ids[0] = "nesya";
use[0] = "aaa";
ful[0] = "text1";
ids[1] = "2";
use[1] = "bbb";
ful[1] = "text2";
ids[2] = "3";
use[2] = "ccc";
ful[2] = "text3";
function Choice(autoEle) {
if(autoEle === 'use') {
selectedIndex = use.indexOf( $('#use').val());
} else if(autoEle === 'ful') {
selectedIndex = ful.indexOf( $('#ful').val());
} else {
selectedIndex = ids.indexOf( $('#ids').val());
}
document.getElementById("ids").value = ids[selectedIndex];
document.getElementById("use").value = use[selectedIndex];
document.getElementById("ful").value = ful[selectedIndex];
}
$("#use").autocomplete({
source: use,
select: function(){
$('#selectUsers option[value="' + (use.indexOf( $('#use').val()) + 1) + '"]').attr('selected','selected');
Choice('use');
}
});
$("#ids").autocomplete({
source: ids,
select: function(){
$('#selectUsers option[value="' + (ids.indexOf( $('#ids').val()) + 1) + '"]').attr('selected','selected');
Choice('ids');
}
});
$("#ful").autocomplete({
source: ful,
select: function(){
$('#selectUsers option[value="' + (ful.indexOf( $('#ful').val()) + 1) + '"]').attr('selected','selected');
Choice('ful');
}
});
//]]>
</script>
</body>

Check the below code :
var ids = new Array();
var use = new Array();
var ful = new Array();
ids[0] = "nesya";
use[0] = "aaa";
ful[0] = "text1";
ids[1] = "2";
use[1] = "bbb";
ful[1] = "text2";
ids[2] = "3";
use[2] = "ccc";
ful[2] = "text3";
function Choice(autoEle, item) {
if(autoEle === 'use') {
selectedIndex = use.indexOf(item);
} else if(autoEle === 'ful') {
selectedIndex = ful.indexOf(item);
} else {
selectedIndex = ids.indexOf(item);
}
document.getElementById("ids").value = ids[selectedIndex];
document.getElementById("use").value = use[selectedIndex];
document.getElementById("ful").value = ful[selectedIndex];
}
$("#use").autocomplete({
source: use,
select: function(e, data){
$('#selectUsers option[value="' + (use.indexOf( $('#use').val()) + 1) + '"]').attr('selected','selected');
Choice('use', data.item.value);
}
});
$("#ids").autocomplete({
source: ids,
select: function(e, data){
$('#selectUsers option[value="' + (ids.indexOf( $('#ids').val()) + 1) + '"]').attr('selected','selected');
Choice('ids', data.item.value);
}
});
$("#ful").autocomplete({
source: ful,
select: function(e, data){
$('#selectUsers option[value="' + (ful.indexOf( $('#ful').val()) + 1) + '"]').attr('selected','selected');
Choice('ful', data.item.value);
}
});

Related

Push to a JSON file

Good morning, I tried to push a temporaly value to a JSON file with the comand "MyJSON.name.push" but it tells me: "Undefined its not an object". I tried some forms and with javascript arrays worked but I need to do it on external JSON file. The error only appears if I click some button. Someone can help me?
Thanks you.
html:
<!DOCTYPE html>
<html>
<head>
<title>SSL Checker</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/json.json" charset="utf-8"></script>
</head>
<body onLoad="start()">
<div id="title">
<h1>SSL Checker</h1>
</div>
<div id="data">
<form action="javascript:void(0);" method="POST" onsubmit="SSL.Add()">
<input type="text" id="add-name" placeholder="Name"></input>
<input type="text" id="add-link" placeholder="Link"></input>
<input type="submit" value="Add">
</form>
<div id="edit" role="aria-hidden">
<form action="javascript:void(0);" method="POST" id="saveEdit">
<input type="text" id="edit-name">
<input type="submit" value="Edit" /> <a onclick="CloseInput()" aria-label="Close">✖</a>
</form>
</div>
<p id="counter"></p>
</div>
<div id="table">
<table style="overflow-x:auto;">
<tr>
<th>Sites:</th>
</tr>
<tbody id="urls">
</tbody>
</table>
</div>
</body>
</html>
js:
function start() {
var SSL = new function() {
//List urls to check
this.el = document.getElementById('urls');
this.Count = function(data) {
var el = document.getElementById('counter');
var name = 'url';
if (data) {
if (data > 1) {
name = 'urls';
}
el.innerHTML = 'There are:' + ' ' + data + ' ' + name;
} else {
el.innerHTML = 'No ' + name;
}
};
//Buttons configuration
this.FetchAll = function() {
var data= '';
if (MyJSON.length > 0) {
for (i = 0; i < MyJSON.length; i++) {
data += '<tr>';
data += '<td>' + MyJSON[i].name+ '</td>';
data += '<td><button onclick="SSL.Edit(' + i + ')">Edit</button></td>';
data += '<td><button onclick="SSL.Delete(' + i + ')">Delete</button></td>';
data += '</tr>';
}
}
this.Count(MyJSON.length);
return this.el.innerHTML = data;
};
//Add name
this.Add = function() {
el = document.getElementById('add-name');
el1 = document.getElementById('add-link')
var url = el.value;
var url1 = el1.value;
if (url) {
if (url) MyJSON.push('{name:"url",url:"url1"}')
el.value = '';
this.FetchAll();
}
}
//Edit
this.Edit = function(item) {
var el = document.getElementById('edit-name');
el.value = MyJSON.name[item];
document.getElementById('edit').style.display = 'block';
self = this;
document.getElementById('saveEdit').onsubmit = function() {
var url = el.value;
if (url) {
self.name.splice(item, 1, url.trim());
self.FetchAll();
CloseInput();
}
}
};
//Delete
this.Delete = function(item) {
MyJSON.urls.splice(item, 1);
this.FetchAll();
};
};
SSL.FetchAll();
function CloseInput() {
document.getElementById('edit').style.display = 'none';
}
window.SSL= SSL;
}
JSON FILE(json.json):
var MyJSON = [{
name:"Google",
url: 'google.es',
},
{
name:"Yahoo",
url: 'yahoo.com',
}
]
Change your this.Add() function like this:
this.Add = function() {
el = document.getElementById('add-name');
el1 = document.getElementById('add-link')
var url = el.value;
var url1 = el1.value;
if (url) {
MyJSON.push({"name":url,"url":url1})
el.value = '';
this.FetchAll();
}
}

Thousand separator while typing and decimal (with comma)

I have a problem.
$('#value-salary').on('keyup', function(){
if($(this).val() != ""){
var n = parseInt($(this).val().replace(/\D/g,''),10);
$(this).val(n.toLocaleString());
}
});
This allow me to see "." as thousand separator while typing. Before submit I will replace "." with "" and for now it's all ok.
The problem is that the keyup doesn't allow me to insert "," and I need to use this as decimal separator (before sending i will replace , with . but user is not interested in rest api. He want to see "," as decimal separator).
How can i fix this problem? Keypress or keydown are not good solutions...thanks!
you can use autoNumeric.js.
$(".testInput").autoNumeric('init', {
aSep: '.',
aDec: ',',
aForm: true,
vMax: '999999999',
vMin: '-999999999'
});
<input class="testInput" type="text" value="8000"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/autonumeric/1.8.2/autoNumeric.js"></script>
please see more information how to use numeric.
http://www.decorplanit.com/plugin/
You can try this piece of code. It places , as thousand separator and you can use . for your decimal separator. You can easily customize the symbols you want to use for each purpose.
<html>
<head>
<script language="javascript" type="text/javascript">
function thousandSeparator(n, sep) {
var sRegExp = new RegExp('(-?[0-9]+)([0-9]{3})'),
sValue = n + '';
if (sep == undefined) { sep = ','; }
while (sRegExp.test(sValue)) {
sValue = sValue.replace(sRegExp, '$1' + sep + '$2');
}
return sValue;
}
function showSeparator() {
var myValue = document.getElementById("txtInvoicePrice").value;
myValue = thousandSeparator(myValue.replace(/,/g, ""), ',');
document.getElementById("txtInvoicePrice").value = myValue;
}
function removeSeparator() {
var myValue = document.getElementById("txtInvoicePrice").value;
myValue = myValue.replace(',', '');
document.getElementById("txtInvoicePrice").value = myValue;
}
</script>
</head>
<body>
<input type="text" id="txtInvoicePrice" onfocus="javascript:removeSeparator();" onblur="javascript:showSeparator();" />
</body>
</html>
It works for me with javascript code:
<input type="text" name="xxx" onkeyup="ididit(this,this.value.charAt(this.value.length-1))" value=""/>
And:
<script>
function ididit(donde,caracter) {
pat = /[\*,\+,\(,\),\?,\\,\$,\[,\],\^]/
valor = donde.value
largo = valor.length
crtr = true
if(isNaN(caracter) || pat.test(caracter) == true) {
if (pat.test(caracter)==true) {
caracter = "\\" + caracter
}
carcter = new RegExp(caracter,"g")
valor = valor.replace(carcter,"")
donde.value = valor
crtr = false
} else {
var nums = new Array()
cont = 0
for(m=0;m<largo;m++) {
if(valor.charAt(m) == "," || valor.charAt(m) == " ") {
continue;
}else{
nums[cont] = valor.charAt(m)
cont++
}
}
}
var cad1="",cad2="",tres=0
var cad3="",cad4=""
if(largo > 3 && crtr == true) {
if (nums[0]=="$"){
nums.shift()
}
for (k=nums.length-1;k>=0;k--) {
cad1 = nums[k]
cad2 = cad1 + cad2
tres++
if((tres%3) == 0) {
if(k!=0){
cad2 = "," + cad2
}
}
if (k==0) {
cad2 = "$ " + cad2
}
}
donde.value = cad2
} else if (largo <= 3 && crtr == true) {
if (nums[0]=="$"){
nums.shift()
}
for (k=nums.length-1;k>=0;k--) {
cad3 = nums[k]
cad4 = cad3 + cad4
if (k==0) {
cad4 = "$ " + cad4
}
}
donde.value = cad4
}
}
</script>

Using div id how to text value in to another div

I am get the alert values of length and breadth .but I am not able to print the text in next div class i am using jquery.
Html:
<input type="hidden" id="len" name="len" value="len" />
<input type="hidden" id="bre" name="bre" value="bre" />
print the values in this div using id:
<div id="length"></div>
<div id="breadth"></div>
Jquery:
var len = ($('#len').attr('value'));
$('#length').text(len);
var bre =($('#bre').attr('value'))
$('#breadth').text(bre);
Jquery full code of submitting:
<script type="text/javascript">
$(window).load(function()
{
$('.green').hide();
$('.red').show();
});
$(document).ready(function(){
$('input[type="radio"]').click(function(){
if($(this).attr("value")=="red")
{
$(".box").not(".red").hide();
$(".red").show();
$(document).ready(function() {
$('#lenbredth').validate({
rules: {
length: {
required: true,
number: true,
range: [48, 84]
},
breadth: {
required: true,
number: true,
range: [24, 78]
}
},enter code here
messages: {
length: {
required: 'Please select a template'
},
breadth: {
required: 'Please select a template'
}
},
submitHandler: function(){
$('div[id ^=div]').hide();
$("#div4").show();
var dataString = $(this.currentForm).serialize();
var lenbreath = dataString.split('&');
var bed1= lenbreath[0];
var len = bed1.substr(7,9);
alert(len);
$("#len").val(len);
var bed2= lenbreath[1];
var bre = bed2.substr(8,10);
$("#bre").val(bre);
return false;
}
});
$("#summer5").click(function() {
$("#lenbredth").submit();
});
$("#length").change(function(){
var length =$(this).val();
$("#breadth").change(function(){
var breadth =$(this).val();
var lenbre= length * breadth;
//alert(lenbre);
var result =length.concat(breadth);
var len = (length * breadth) ;
});
});
});
}
if($(this).attr("value")=="green")
{
$(".box").not(".green").hide();
$(".green").show();
$(window).load(function()
{
$('.dimension').hide();
$('#d1').show();
});
$('.bed_type ul li ').click(function()
{
var i = $(this).index();
$('.dimension').hide();
$('#d' + (i+1)).show();
var type ='b' + (i+1);
document.getElementById(type).addEventListener("click", bedtype);
});
$('.dimension ul li').click(function () {
var i = $(this).index();
var single ='single' + (i+1);
//alert(single);
var doubles ='doubles' + (i+1);
var queen ='queen' + (i+1);
var king ='king' + (i+1);
document.getElementById(single).addEventListener("click", price);
document.getElementById(doubles).addEventListener("click", price);
document.getElementById(queen).addEventListener("click", price);
document.getElementById(king).addEventListener("click", price);
});
function price()
{
$(document).ready(function() {
$('#radioselection').validate({
submitHandler: function(){
$('div[id ^=div]').hide();
$("#div4").show();
var dataString = $(this.currentForm).serialize();
var lenbre = dataString.substr(22,27);
var arr = lenbre.split('*');
var len= arr[0];
$("#len").val(len);
var bre= arr[1];
$("#bre").val(bre);
return false;
}
});
$("#summerss").click(function() {
$("#radioselection").submit();
});
var price_btn=this.id;
var price_value = document.getElementById(price_btn).value;
var arr = price_value.split('*');
});
}
}
});
});
$(document).ready(function()
{
$('#plainpattern').validate({
rules: {
plainpattern:{
required: true
}
},
messages: {
plainpattern:{
required: 'Please select the image plain or pattern'
}
},
submitHandler: function(){
$('div[id ^=div]').hide();
$("#div5").show();
var len = ($('#len').attr('value'));
$('#length').text($('#len').val());
var bre =($('#bre').attr('value'))
$('#breadth').text($('#bre').val());
var dataString = $(this.currentForm).serialize();
var plainpattern = dataString.substr(13,16);
$("#mattersplainpatters").text(plainpattern + ' "');
return false;
}
});
$("#summer7").click(function() {
$("#plainpattern").submit();
});
$('li').click( function(){
$('li').removeClass('selected');
$(this).addClass('selected');
var legend = $(this).children("input[type=radio]").val();
});
});
Try this
$('#length').text($('#len').val());
$('#breadth').text($('#bre').val());
It worked after including jquery and writing your jquery code in $(document).ready() or $(function(){})
$(function(){
var len = ($('#len').attr('value'));
$('#length').text(len);
var bre =($('#bre').attr('value'))
$('#breadth').text(bre);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" id="len" name="len" value="len" />
<input type="hidden" id="bre" name="bre" value="bre" />
<div id="length"></div>
<div id="breadth"></div>
altrnatively to get value use
$('#len').val();
to get the value of len

Why drop down display first character in capital after dot

I make a drop down on pop up screen. I am able to make that drop down using jQuery mobile. I used dform plugin. Everything is working fine. But I have one issue my first character display in capital letter when I added bootstrap.min.css - why?
When I run my program without bootstrap.min.css, it works fine. But when I run with bootstrap.css, it give first letter capital after . . As I written in small. This problem is only in chrome browser. When I run in firefox it works perfectly.
Can you please explain why it is occurring?
Here is my code.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<link href=" https://dl.dropboxusercontent.com/s/bbvcx2zc4ocuqzt/bootstrap.min.css?m=" rel="stylesheet" type="text/css" />
<link href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" rel="stylesheet" type="text/css" />
<link href=" https://dl.dropboxusercontent.com/s/hg36tk1m7rc4gnj/style.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<script src="https://rawgit.com/daffl/jquery.dform/master/dist/jquery.dform-1.1.0.js"></script>
</head>
<body>
<button id="test">test</button>
<div data-role="popup" data-dismissible='false' data-transition="flip" id="tabbedPopup" data-theme="a"><a href="#"
data-rel="back"
data-role="button"
data-theme="a"
data-icon="delete"
data-iconpos="notext"
class="ui-btn-right cross-border cross-border closePopUp_h button circleClass" >Close</a>
<div id="commandInfo"></div>
<div id="commandInfoheader" class="comandinfoheader"></div>
<div data-role="collapsible-set" data-theme="b" data-content-theme="b" id="tabbedSet" data-iconpos="left">
</div>
</div>
</body>
<script type="text/javascript">
$(function () {
$('#test').click(function(){
createCommandPopUpTabs("tc_2-cmd_1_VoiceCallAudioMosMO");
$("#tabbedPopup").popup("open");
})
});
function createCommandPopUpTabs(id) {
var tabsHeader = ["InputParameter"];
var header = "<h3 >hh</h3>";
var commmand = "VoiceCallAudioMosMO";
var button = '<button onclick="return submitCommand("' + id
+ '")" style="" class="donebtn common-button1">Save</button>';
//$("#commandInfo").append(header);
$("#commandInfo").append(button);
$("#commandInfoheader").html(header);
for ( var i = 0; i < tabsHeader.length; i++) {
var headerId = tabsHeader[i] + "_tab" + commmand;
var header = "<div data-role='collapsible' data-collapsed='false' id='"
+ headerId + "'><h3>hhh</h3></div>";
var content = generateCommandTabContent(tabsHeader[i], id);
$("#tabbedSet").append(header);
$("#tabbedSet").find("#" + headerId).append(content);
$("#tabbedSet").collapsibleset("refresh");
$('input[name=direction]').parent().addClass('cleassr')
$("#tabbedSet").children(":first").collapsible( "expand" );
}
}
function generateCommandTabContent(name, id) {
var commandName = "VoiceCallAudioMosMO";
if (name == "InputParameter") {
var object = new window[commandName]();
var map = object.generateInputRequirment();
var formData = generateInputParamForm(map, id, status);
var form = $("<form />");
var dform = form.dform(formData);
return dform;
}
return null;
}
function VoiceCallAudioMosMO() {
COMMAND_NAME = "VoiceCallMos";
COMMAND_DISPLAY_NAME = "VoiceCallMOS";
this.map = {};
}
VoiceCallAudioMosMO.prototype.generateInputRequirment = function () {
if(typeof VoiceCallAudioMosMO.JSON!="undefined") {
var inputs = VoiceCallAudioMosMO.JSON.input;
for (var key in inputs) {
var inputField = inputs[key];
var inputParameterInfo = new InputParameterInfo();
for (var inputKey in inputField) {
inputParameterInfo[inputKey] = inputField[inputKey];
}
this.map[inputParameterInfo.name] = inputParameterInfo;
}
return this.map;
}
};
function InputParameterInfo() {
}
VoiceCallAudioMosMO.JSON = {
"commandName": "VoiceCallAudioMosMO",
"input": {
"refFileName": {
"displayDetail": "The reference file name to play in case of uplink channel",
"displayName": "Ref File Name",
"inputType": "SWITCH",
"name": "refFileName",
"inputValues": {
"USAReference.wav": "USAReference.wav",
"Reference.wav": "Reference.wav"
},
"value": "",
"unit": "NONE",
"required": false,
"visible": true
}
}
};
function generateInputParamForm(map, id, status) {
var formId = "form_" + id;
var formdata = {
elements : []
};
formdata.id = formId;
formdata.name = formId;
formdata.method = "post";
var div = {
html : []
};
div.type = "div";
div.class = "inputDiv";
div.caption = "<h3>Input Parameters</h3>";
var tabIndex = 1;
var arr = id.split("-");
var data = null;
for ( var key in map) {
var inputObj = map[key];
if (inputObj.visible==false && inputObj.required==false) {
continue;
}else {
var obj = createFormObject(inputObj);
}
//var obj = createFormObject(inputObj);
if(typeof data=="undefined"){
obj.value = inputObj["value"];
}else if (data != undefined && data.hasOwnProperty(inputObj["name"])) {
obj.value = data[inputObj["name"]];
}
/*if (data != undefined && data.hasOwnProperty(inputObj["name"])) {
obj.value = data[inputObj["name"]];
} else if (inputObj.hasOwnProperty("value")) {
obj.value = inputObj["value"];
}*/
if (status == "view") {
obj.readonly = "true";
obj.disabled = "disabled";
}
obj.tabindex = tabIndex;
var objName = "VoiceCallAudioMosMO";
obj.onblur = "validateElement('" + objName + "', '" + formId + "','"
+ obj.name + "')";
var unit = {};
var fieldset = {
html : []
};
fieldset.type = "fieldset";
fieldset.caption = inputObj["displayName"];
fieldset.html.push(obj);
$("div > fieldset legend:contains('*')").each(function () {
$(this).html($(this).html().replace("*", "<span class='red'>*</span>"));
});
div.html.push(fieldset);
tabIndex++;
}
formdata.elements.push(div);
return formdata;
}
function createFormObject(inputObj) {
var obj = {};
if (inputObj.hasOwnProperty("inputType")) {
if (inputObj["inputType"] == "LIST") {
var list = inputObj["inputValues"];
obj.type = "select";
obj.options = list;
} else if (inputObj["inputType"] == "NUMBER") {
obj.type = "text";
} else if (inputObj["inputType"] == "SWITCH") {
var list = inputObj["inputValues"];
obj.type = "select";
obj.options = list;
} else {
obj.type = "text";
}
} else {
obj.type = "text";
}
if (!inputObj.hasOwnProperty("displayName")) {
obj.type = "hidden";
}
obj.id = inputObj["name"];
obj.name = inputObj["name"];
obj.required = inputObj["required"];
obj.placeholder = inputObj["placeholder"];
obj.classes = inputObj["class"];
obj.className = inputObj["class"];
obj.class = inputObj["class"];
obj.title= inputObj["displayDetail"];
return obj;
}
</script>
</html>
It display a drop down when you click button.Drop down Value USAReference.wav.here I written "w" in small but it display in capital.but when I remove this css
https://dl.dropboxusercontent.com/s/bbvcx2zc4ocuqzt/bootstrap.min.css?m=" rel="stylesheet" type="text/css" />
it show in small letter ? why ?
After a long research I found the solution own .there is a property
text-transform: capitalize written on 247 line Number bootstrap.css file.I remove that property.I am able to solve my problem

JavaScript not being executed onClick

I have a webpage where I'm processing an HTML form using JavaScript and onClick, but the JavaScript code isn't being executed.
This is my form:
<form action="" method="post" id="reportform">
<input type="radio" name="report" value="customer"><p>Customers</p>
<input type="radio" name="report" value="item"><p>Items Sold</p>
<input type="radio" name="report" value="department"><p>Sales Departments</p>
<input type="radio" name="report" value="person"><p>Sales People</p>
<input type="button" name="reportsubmit" value="Submit" onClick="checkReport(this.form)">
</form>
And this is the JavaScript code (by this way both the JavaScript and the form are located in the body tag):
function checkReport (form)
{
var checked = form.querySelector('input:checked');
var value = checked ? checked.value : null;
if (value == "customer")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#customer" + href.slice(idx+19);
window.location.replace(new_href);
}
else if (value == "item")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#item" + href.slice(idx+19);
window.location.replace(new_href);
}
else if (value == "department")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#department" + href.slice(idx+19);
window.location.replace(new_href);
}
else if (value == "person")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#person" + href.slice(idx+19);
window.location.replace(new_href);
}
}
function checkCustomer(form)
{
var checked = form.querySelector('input:checked');
var value = checked ? checked.value : null;
if (value == "all")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#allcustomers" + href.slice(idx+19);
window.location.replace(new_href);
}
else if (value == "one")
{
var href = "http://bdpastudents.com/~a7068104/2013-2014/Lab_13/Reports/Reports.php";
var idx = href.indexOf("Reports", 0);
var new_href = href.slice(0,idx+19) + "#onecustomer" + href.slice(idx+19);
window.location.replace(new_href);
}
}
Your HTML is illegal. You have not closed your input tags. Who knew, you don't have to close your tags. Sorry about that.
Can you replicate your problem on this fiddle? Or does this work for you?
var form = document.getElementById('reportForm');
http://jsfiddle.net/mgDGN/

Categories