I have a script where I am trying to only import fields that are not disabled to mysql.
my problem is that when its disabled it still imports the field that is in the selection
function toggleCatDisability()
{
document.getElementsByClassName('cat_border')[0].disabled = false;
document.getElementsByClassName('tech_border')[0].disabled = true;
document.getElementsByClassName('splatter_border')[0].disabled = true;
document.getElementsByClassName('fancy_border')[0].disabled = true;
}
function toggleTechDisability()
{
document.getElementsByClassName('tech_border')[0].disabled = false;
document.getElementsByClassName('cat_border')[0].disabled = true;
document.getElementsByClassName('splatter_border')[0].disabled = true;
document.getElementsByClassName('fancy_border')[0].disabled = true;
}
<center>
<input type="button" value="Update Tag" onClick="updateTagSettings()" />
</center><br /><br /><div id="ajax_spot" style="text-align:center;"></div>
<center><input type="text" id="tag_name" value="" maxlength="15"/>
<div>
</div>
<div>
Border Style:
<div>
<input type="button" value="Kitten"onclick="toggleCatDisability()"/>
</select>
Color:<select id="tag_border" class="cat_border" disabled="disabled">
<option value="Border_Cat_Black.png">Black</option>
<option value="Border_Cat_DBlue.png">Dark Blue</option>
<option value="Border_Cat_LBlue.png">Light Blue</option>
<option value="Border_Cat_Green.png">Green</option>
<option value="Border_Cat_Orange.png">Orange</option>
<option value="Border_Cat_Pink.png">Pink</option>
<option value="Border_Cat_Purple.png">Purple</option>
<option value="Border_Cat_Red.png">Red</option>
<option value="Border_Cat_Yellow.png">Yellow</option>
</select>
</div>
</div>
<div>
<input type="button" value="Tech"onclick="toggleTechDisability()"/>
Color:<select id="tag_border" class="tech_border" disabled="disabled">
<option value="Border_Cat_Black.png">Black</option>
<option value="Border_Cat_DBlue.png">Dark Blue</option>
<option value="Border_Cat_LBlue.png">Light Blue</option>
<option value="Border_Cat_Green.png">Green</option>
<option value="Border_Cat_Orange.png">Orange</option>
<option value="Border_Cat_Pink.png">Pink</option>
<option value="Border_Cat_Purple.png">Purple</option>
<option value="Border_Cat_Red.png">Red</option>
<option value="Border_Cat_Yellow.png">Yellow</option>
</select>
</div>
<div>
Background:<select id="tag_bg" >
<option>Choose Color</option>
<option value="BG_Black.png">Black</option>
<option value="BG_DBlue.png">Dark Blue</option>
<option value="BG_LBlue.png">Light Blue</option>
<option value="BG_Green.png">Green</option>
<option value="BG_Orange.png">Orange</option>
<option value="BG_Pink.png">Pink</option>
<option value="BG_Purple.png">Purple</option>
<option value="BG_Red.png">Red</option>
<option value="BG_Yellow.png">Yellow</option>
</select>
</div>
<div>
</div>
</center>
<div class="clear"></div>
</div>
</div>
Edit: PHP and Javascript-
PHP
function updateTagValues() {
global $logon;
$tag_name= mysql_real_escape_string($_POST['tagname']);
$tag_bg= mysql_real_escape_string($_POST['tagbg']);
$tag_border= mysql_real_escape_string($_POST['tagborder']);
$tag_decal= mysql_real_escape_string($_POST['tagdecal']);
mysql_query("UPDATE gamezove_deciet.groups SET leader_name = '" . $logon->username . "', name='" . $tag_name . "', bg='" . $tag_bg . "', border='" . $tag_border . "', decal='" . $tag_decal . "' WHERE `leader_name`='" . $logon->username . "'", $this->c) or die("Something went wrong, please try again!");
if (strlen($password) > 0){
echo "Your tag have been updated!";
if(strlen($password) > 0){
$logon->logout();
}
}
}
Javascript/jQuery
function saveTagSettings() {
var tagname = $("#tag_name").val()
var tagbg = $("#tag_bg").val()
var tagborder = $("#tag_border").val()
var tagdecal = $("#tag_decal").val()
$("#ajax_spot").html("<img src='theme/" + theme + "/images/ajax.gif' />")
$.post("inc/forum_ajax.php", { ajax: 19, tagname: tagname, tagbg: tagbg, tagborder: tagborder, tagdecal: tagdecal}, function(data) {
$("#ajax_spot").html(data)
});
}
I know that there is a way to do this I just don't know how.
I'm guessing I need to do more with the disable function but not exactly sure what.
any help would be greatly appreciated:)
Related
I have a form in this There are two field One is Search and other is Option When i select any value from Search field the value of Option field will change.Value of Second field are different datalist defines as datalist1,datalist2,datalist3.....I want the value given in List attribute of Second filed to be same as the variable value in java script.i Tried the following code this code is not giving any output.
function random() {
var a = document.getElementById('search').value;
if (a === "sampleid") {
var datalist = datalist1;
} else if (a === "facility") {
var datalist = datalist1;
} else if (a === "user") {
var datalist = datalist3;
} else if (a === "affiliation") {
var datalist = datalist4;
} else if (a === "status") {
var datalist = datalist5;
} else if (a === "btr") {
var datalist = datalist6;
} else if (a === "type") {
var datalist = datalist7;
}
document.getElementById('option').innerHTML = datalist;
}
<form class="form-inline" method="post" action="search-sample.php">
<div class="col-md-5" align="center">
<label class="search">SEARCH BY-</label>
<select type="text" name="SEARCH" id="search" class="form-control" onchange="random()">
<option value="SELECT TYPE">SELECT TYPE</option>
<option value="sampleid">SAMPLE-ID</option>
<option value="facility">FACILITY</option>
<option value="user">USER NAME</option>
<option value="affiliation">AFFILIATION</option>
<option value="status">STATUS</option>
<option value="btr">BTR</option>
<option value="type">SAMPLE TYPE</option>
<option value="date">DATE</option>
</select>
</div>
<div class="col-md-5" align="center">
<label class="search">OPTION</label>
<input type="text" class="form-control" id="option" name="facility" list=< ?php echo "datalist" ?> />
</div>
<datalist id="datalist1">
<option value=""> </option>
<?php
$sql = "SELECT * from tblfacility order by sampleid asc";
$query = $dbh -> prepare($sql);
$query->execute();
$results=$query->fetchAll(PDO::FETCH_OBJ);
$cnt=1;
if($query->rowCount() > 0)
{
foreach($results as $result)
{ ?>
<option value="<?php echo htmlentities($result->sampleid);?>"><?php echo htmlentities($result->sampleid);?></option>
<?php }} ?>
</datalist>
Here is what you need to do.
Use quotes around the IDs of the datalists
Use setAttribute of the list attribute of the input
function random() {
var a = document.getElementById('search').value,
datalist = "datalist1";
if (a === "sampleid") {
datalist = "datalist1";
} else if (a === "facility") {
datalist = "datalist1";
} else if (a === "user") {
datalist = "datalist2";
} else if (a === "affiliation") {
datalist = "datalist3";
} else if (a === "status") {
datalist = "datalist1";
} else if (a === "btr") {
datalist = "datalist2";
} else if (a === "type") {
datalist = "datalist3";
}
const inp = document.getElementById('option');
inp.value="";
inp.setAttribute("list", datalist)
}
<form class="form-inline" method="post" action="search-sample.php">
<div class="col-md-5" align="center">
<label class="search">SEARCH BY-</label>
<select type="text" name="SEARCH" id="search" class="form-control" onchange="random()">
<option value="SELECT TYPE">SELECT TYPE</option>
<option value="sampleid">SAMPLE-ID</option>
<option value="facility">FACILITY</option>
<option value="user">USER NAME</option>
<option value="affiliation">AFFILIATION</option>
<option value="status">STATUS</option>
<option value="btr">BTR</option>
<option value="type">SAMPLE TYPE</option>
<option value="date">DATE</option>
</select>
</div>
<div class="col-md-5" align="center">
<label class="search">OPTION</label>
<input type="text" class="form-control" id="option" name="facility" list="" />
</div>
<datalist id="datalist1">
<option value="A"> </option>
<option value="B"> </option>
<option value="C"> </option>
<option value="D"> </option>
</datalist>
<datalist id="datalist2">
<option value="AA"> </option>
<option value="BB"> </option>
<option value="CC"> </option>
<option value="DD"> </option>
</datalist>
<datalist id="datalist3">
<option value="AAA"> </option>
<option value="BBB"> </option>
<option value="CCC"> </option>
<option value="DDD"> </option>
</datalist>
</form>
I think what you're trying to do is assign a datalist to the "option" input based on the selected value in the select element, something like the following cut–down version of the OP:
// Select is a reference to the select element and
// is passed from the listener
function random(select) {
// Map select value to id of list to display
let map = {'sampleid': 'datalist1',
'facility': 'datalist2',
'user': 'datalist3'
};
// Get the option input
let option = document.getElementById('option');
// Clear the value
option.value = '';
// Assign the appropriate list
option.setAttribute('list', map[select.value]);
}
<form>
<label>SEARCH BY-</label>
<select name="SEARCH" id="search" onchange="random(this)">
<option value="SELECT TYPE">SELECT TYPE</option>
<option value="sampleid">SAMPLE-ID</option>
<option value="facility">FACILITY</option>
<option value="user">USER</option>
</select>
<!-- opton input to display options -->
<input list="" id="option" name="option">
<!-- datalists of options -->
<datalist id="datalist1">
<option value="datalist1 A">
<option value="datalist1 B">
<option value="datalist1 C">
</datalist>
<datalist id="datalist2">
<option value="datalist2 AA">
<option value="datalist2 BB">
<option value="datalist2 CC">
</datalist>
<datalist id="datalist3">
<option value="datalist3 AAA">
<option value="datalist3 BBB">
<option value="datalist3 CCC">
</datalist>
</form>
You should probably also disable the input if the selected value is the first one (i.e. select.selectedIndex = 0).
Use value instead of innerHTML.
document.getElementById('option').value= datalist;
I get these type of array in my javascript function as shown in image.Now i want selected all city in my dropdownlist which i get in my javascript array.
I have tried it but i didn't get success.How to do it.
function searchitem(id,name)
{
var ADDRESS = value.Address;
console.log(ADDRESS);
$("#Address option[value='" + vin + "']").prop("selected", true);
}
HTML Code
<select class="ct-js-select ct-select-lg" multiple="multiple" id="Address" name="Address[]" style="margin-left:14px;">
<option value="any">Any</option>
<optgroup label="City">
<?php foreach($Locations_Response->city as $CITIES){ ?>
<option value="<?php echo $CITIES; ?>"><?php echo $CITIES; ?></option>
<?php } ?>
</optgroup>
</select>
You need a loop:
var ADDRESS = ['Aberdeen Twp.','2'];
$.each(ADDRESS,function(i,vin) {
$("#Address option[value='" + vin + "']").prop("selected", true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="ct-js-select ct-select-lg" multiple="multiple" id="Address" name="Address[]" style="margin-left: 14px; " tabindex="-1">
<option value="any">Any</option>
<optgroup label="City">
<option value="Aberdeen Twp.">Aberdeen Twp.</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</optgroup>
</select>
<select id='slc' name='slc'>
<?php
for($c=0;$c<10;$c++)
{
echo"<option> ".$c." </option>";
}
?>
script here
var txt=$('#slc').find(":selected").text();
This is my first post, so please be kind. :-)
I have a form with several arrays and other items. Some form fields can be entered more than once which is why they are arrays. I am using Jquery 1.11.1 and jquery validate. Two of my arrays are only required depending on a choice from a drop-down list. If the correct items are not filled in or selected, I get all of the error messages I expect. And, when all items are completed, all error messages are gone.
The problem is, the form will not then submit. I believe it has something to do with the "conditional" arrays because I have another form where the arrays are all required and it works fine.
This has been driving me crazy for a while now - long enough to post the question here. I have looked at many, many postings here and haven't found anyone with my exact problem.
I'm hoping someone can help.
Here is the HTML form (the JS and validation are included before the form):
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://ggsghpcc.sgt-inc.com/cmct/js/jquery.validate.js"></script>
<script language="JavaScript">
numComps = 1;
function showCampaigns(id) {
var mission1 = "missionOne";
var mission2 = "missionTwo";
var compNumber = id.slice(10);
var selection = document.getElementById(id).value;
if (selection == "missionOne") {
document.getElementById(selection + "_" + compNumber).style.display = "block";
document.getElementById(mission2 + "_" + compNumber).style.display = "none";}
if (selection == "missionTwo") {
document.getElementById(selection + "_" + compNumber).style.display = "block";
document.getElementById(mission1 + "_" + compNumber).style.display = "none"; }
}
$(document).ready(function() {
var u_campaignMissionOne = new Array;
var u_campaignMissionTwo = new Array;
var u_dataset = new Array;
var u_mission = new Array;
var FS = 1;
var x = 2;
var u_variable = new Array;
var u_intIndex = new Array;
$("#submitData").validate({
rules: {
'u_variable[]': {
required: true
},
'u_intIndex[]': {
required: true,
min: 1
},
'u_mission[]': {
required: true
},
'u_campaignMissionOne[]': {
required: function(element) {
var setNumber = $(element).attr('id');
var setNum = "comp" + setNumber.slice(21);
var missionNum = "u_mission_" + setNumber.slice(21);
return $((document.getElementById(missionNum).value) == 'MissionOne');
}
},
'u_campaignMissionTwo[]': {
required: function(element) {
var setNumber = $(element).attr('id');
var setNum = "comp" + setNumber.slice(21);
var missionNum = "u_mission_" + setNumber.slice(21);
return $((document.getElementById(missionNum).value) == 'MissionTwo');
}
},
'u_dataSet[]': {
required: true
}
},
messages: {
'u_variable[]': {
required:" Please enter a variable",
},
'u_intIndex[]': {
required:" Please enter a time interval",
},
'u_mission[]': {
required:" Please select a mission"
},
'u_campaignMissionOne[]': {
required:" Please select a Mission One campaign"
},
'u_campaignMissionTwo[]': {
required:" Please select a Mission Two campaign"
},
'u_dataSet[]': {
required:" Please select a data set"
}
},
wrapper: 'span',
errorPlacement: function (error, element) {
error.css({'padding-left':'10px','padding-top':'0.5em','padding-bottom':'2px', 'color': 'red', 'font-style':'italic', 'font-size':'14px', 'width': '330px', 'float': 'right'});
error.insertAfter(element);
}
});
});
</script>
<h2>Submit data</h2>
<div class="full-width-content-item">
<form id="submitData" action="alert.php" method="post" enctype="multipart/form-data">
<div>
<div id="formStuff" style="margin:0; padding:0; display:inline;">
<div style="height:40px; width:100%;"></div>
<div id="comp1">
<fieldset><legend>Data</legend>
<div id="intervalIndex">
<div class="fieldLabel"><label class="control-label">Time index*</label></div>
<input type="text" size="10" id="u_intIndex_1" name="u_intIndex[]" placeholder="Integer value > 0" value=""/>
</div><!--end intervalIndex--><br clear="right" />
<div id="variable">
<div class="fieldLabel"><label class="control-label">Variable*</label></div>
<input type="text" id="u_variable_1" name="u_variable[]" class="u_variable" value="" />
</div><!--end variable--><br clear="right" />
<div>
<div class="fieldLabel"><label class="control-label">Mission*</label> </div>
<select name="u_mission[]" id="u_mission_1" onchange="showCampaigns(this.id);">
<option value="">Please select</option>
<option value="missionOne" >Mission One</option>
<option value="missionTwo" >Mission Two</option>
</select>
</div><br clear="right" />
<div class="campaign">
<div class="missionOne" id="missionOne_1" style="height:3.0em; display:none;">
<div class="fieldLabel"><label class="control-label">Mission One Campaign*</label></div>
<select name="u_campaignMissionOne[]" id="u_campaignMissionOne_1" >
<option value="">Please select</option>
<option value="Campaign-MissionOne-1" >Campaign-MissionOne-1</option>
<option value="Campaign-MissionOne-2" >Campaign-MissionOne-2</option>
<option value="Campaign-MissionOne-3" >Campaign-MissionOne-3</option>
<option value="Campaign-MissionOne-4" >Campaign-MissionOne-4</option>
<option value="Campaign-MissionOne-5" >Campaign-MissionOne-5</option>
</select>
</div>
<div class="missionTwo" id="missionTwo_1" style="display:none;">
<div class="fieldLabel"><label class="control-label">Mission Two Campaign*</label></div>
<select name="u_campaignMissionTwo[]" id="u_campaignMissionTwo_1">
<option value="">Please select</option>
<option value="Campaign-MissionTwo-1" >Campaign-MissionTwo-1</option>
<option value="Campaign-MissionTwo-2" >Campaign-MissionTwo-2</option>
<option value="Campaign-MissionTwo-3" >Campaign-MissionTwo-3</option>
<option value="Campaign-MissionTwo-4" >Campaign-MissionTwo-4</option>
<option value="Campaign-MissionTwo-5" >Campaign-MissionTwo-5</option>
</select>
</div>
</div><!--end class=campaign--><br clear="right" />
<div>
<div class="fieldLabel"><label class="control-label">Data set*</label> </div>
<select name="u_dataSet[]" id="u_dataSet_1">
<option value="">Please select</option>
<option value="dataSet1" >dataSet 1</option>
<option value="dataSet2" >dataSet 2</option>
<option value="dataSet3" >dataSet 3</option>
<option value="dataSet4" >dataSet 4</option>
<option value="dataSet5" >dataSet 5</option>
</select>
</div><br clear="right" />
</fieldset></div><!--end comp1 div-->
<div style="height:40px; width:100%;"></div>
<div id="comp2">
<fieldset><legend>Data</legend>
<div id="intervalIndex">
<div class="fieldLabel"><label class="control-label">Time index*</label></div>
<input type="text" size="10" id="u_intIndex_2" name="u_intIndex[]" placeholder="Integer value > 0" value=""/>
</div><!--end intervalIndex--><br clear="right" />
<div id="variable">
<div class="fieldLabel"><label class="control-label">Variable*</label></div>
<input type="text" id="u_variable_2" name="u_variable[]" value="" />
</div><!--end variable--><br clear="right" />
<div>
<div class="fieldLabel"><label class="control-label">Mission*</label></div>
<select name="u_mission[]" id="u_mission_2" onchange="showCampaigns(this.id);">
<option value="">Please select</option>
<option value="missionOne" >Mission One</option>
<option value="missionTwo" >Mission Two</option>
</select>
</div><br clear="right" />
<div class="campaign">
<div class="missionOne" id="missionOne_2" style="height:3.0em; display:none;">
<div class="fieldLabel"><label class="control-label">Mission One Campaign*</label></div>
<select name="u_campaignMissionOne[]" id="u_campaignMissionOne_2" >
<option value="">Please select</option>
<option value="Campaign-MissionOne-1" >Campaign-MissionOne-1</option>
<option value="Campaign-MissionOne-2" >Campaign-MissionOne-2</option>
<option value="Campaign-MissionOne-3" >Campaign-MissionOne-3</option>
<option value="Campaign-MissionOne-4" >Campaign-MissionOne-4</option>
<option value="Campaign-MissionOne-5" >Campaign-MissionOne-5</option>
</select>
</div>
<div class="missionTwo" id="missionTwo_2" style="display:none;">
<div class="fieldLabel"><label class="control-label">Mission Two Campaign*</label></div>
<select name="u_campaignMissionTwo[]" id="u_campaignMissionTwo_2">
<option value="">Please select</option>
<option value="Campaign-MissionTwo-1" >Campaign-MissionTwo-1</option>
<option value="Campaign-MissionTwo-2" >Campaign-MissionTwo-2</option>
<option value="Campaign-MissionTwo-3" >Campaign-MissionTwo-3</option>
<option value="Campaign-MissionTwo-4" >Campaign-MissionTwo-4<option>
<option value="Campaign-MissionTwo-5" >Campaign-MissionTwo-5<option>
</select>
</div>
</div><!--end class=campaign--><br clear="right" />
<div>
<div class="fieldLabel"><label class="control-label">Data set*</label></div>
<select name="u_dataSet[]" id="u_dataSet_2">
<option value="">Please select</option>
<option value="dataSet1" >dataSet 1</option>
<option value="dataSet2" >dataSet 2</option>
<option value="dataSet3" >dataSet 3</option>
<option value="dataSet4" >dataSet 4</option>
<option value="dataSet5" >dataSet 5</option>
</select>
</div><br clear="right" />
</fieldset></div><!--end comp2 div-->
<div style="height:20px; width:100%;"></div>
<button type="submit" >Submit</button></div>
</form>
I've found some code via google that I could use it should be corrected to fit my but when I select something from my drop down menu, nothing happens. have no idea of what I'm doing wrong.
<select name="h1" id="h1">
<?php
echo "<option value=".$rowlift['H1'].">".$rowlift['H1']."</option>";
$pris = mysql_query("SELECT * FROM priser ORDER BY id ASC");
while($rowP = mysql_fetch_assoc($pris))
echo "<option value='".$rowP['pris'].",".$rowP['id']."'>".$rowP['hojde']. "</option>";
?>
</select>
<?php
if($rowlift['p1'] != '')
echo "<input type='text' id='pris1' name='p1' value='".$rowlift['p1']."'>";
else
echo "<input type='text' id='pris1' name='p1'>"
?>
<script type="text/javascript">
var mytextbox = document.getElementById('pris1');
var mydropdown = document.getElementById('h1');
var mySplitResult = mydropdown.split(",");
mydropdown.onchange = function(){
mytextbox.value = mySplitResult[0];
}
</script>
i hope this the think you was looking for.. when i select something nothing happens.
<select name="h1" id="h1">
<option value=""></option>
<option value="80,1">1000m</option>
<option value="90,2">1200m</option>
<option value="100,3">1500m</option>
<option value="110,4">2000m</option>
<option value="120,5">2250m</option>
<option value="130,6">2500m</option>
<option value="140,7">3000m</option>
<option value="150,8">3500m</option>
<option value="160,9">4000m</option>
<option value="160,10">Elev man.</option>
<option value="160,11">Elev auto</option>
<option value="0,12">HM</option>
<option value="2000,13">Tandem pass u/video</option>
<option value="2300,14">Tandem håndhold video</option>
<option value="2600,15">Tandem pass m/video</option>
<option value="0,16">Tandem master</option>
<option value="-100,17">Tandem video</option>
</select>
<td>
<input type="text" id="pris1" name="p1"> <script type="text/javascript">
var dropdownId = document.getElementById("h1");
var mytextbox = document.getElementById('pris1');
var mySplitResult = strUser .split(",");
dropdownId.onchange = function(){
mytextbox.value = mySplitResult[1] //to (not) appened
//mytextbox.innerHTML = this.value;
}
</script>
</td>
I think it should be mydropdown.value.split(',');
var dropdownId = document.getElementById("yourdropdownId");
var strUser = dropdownId .options[dropdownId .selectedIndex].value;
var mySplitResult = strUser .split(",");
wrap the above code in onchange()
this is how it should be.. :D
<select name="sel1" id="sel1" onchange ="show()" >
<option value="">Choose .....</option>
<option value="80~1">1000m</option>
<option value="90~2">1200m</option>
<option value="100~3">1500m</option>
<option value="110~4">2000m</option>
<option value="120~5">2250m</option>
<option value="130~6">2500m</option>
<option value="140~7">3000m</option>
<option value="150~8">3500m</option>
<option value="160~9">4000m</option>
<option value="160~10">Elev man.</option>
<option value="160~11">Elev auto</option>
<option value="0~12">HM</option>
<option value="2000~3">Tandem pass u/video</option>
<option value="2300~14">Tandem håndhold video</option>
<option value="2600~15">Tandem pass m/video</option>
<option value="0~16">Tandem master</option>
<option value="-100~17">Tandem video</option>
</select>
<td>
<input type="text" id="pris1" name="pris1">
<script type="text/javascript">
function show() {
var dropdownId = document.getElementById("sel1").value;
var mytextbox = document.getElementById('pris1');
var mySplitResult = dropdownId .split("~");
mytextbox.value = mySplitResult[0];
}
</script>
I want to click on a image and redirect to a url that has the subdomain $platform and filter $search_filter. This is what i have so far. Help please?
<head>
<script>
function search_platform() {
var $platform=document.getElementById("search_platform").value;
var $search_filter=document.getElementById("search_filter").value;
if ($platform !== '0') {
document.location.href='http://www.' + $platform + 'domain.com/index.php?filter_name=' + $search_filter;
}
}
</script>
</head>
<body>
<select id="search_platform">
<option value="0" selected="selected"><?php echo 'Select Platform'; ?></option>
<option value="platform1">Platform 1</option>
<option value="platform1">Platform 1</option>
<option value="platform1">Platform 1</option>
</select>
<input type="text" name="filter_name"/>
<img src="test.png" width="264" height="110" onclick="search_platform()"/>
</body>
Try this :
<head>
<script>
function search_platform() {
//Removed $ from variables name
var platform=document.getElementById("search_platform").value;
var search_filter=document.getElementById("search_filter").value;
if (platform !== '0') {
document.location.href='http://www.' + platform + 'domain.com/index.php?filter_name=' + search_filter;
}
}
</script>
</head>
<body>
<select id="search_platform">
<option value="0" selected="selected"><?php echo 'Select Platform'; ?></option>
<option value="platform1">Platform 1</option>
<option value="platform1">Platform 1</option>
<option value="platform1">Platform 1</option>
</select>
<input type="text" name="filter_name" id="search_filter"/> <!-- Added id -->
<img src="test.png" width="264" height="110" onclick="search_platform()"/>
</body>
You're missing the ID in the input field:
<input type="text" name="filter_name" id="search_filter"/>
I think your issue is getting value from select element. try below
<script>
function search_platform() {
var $platform=document.getElementById("search_platform").value;
var $selectedplatform = platform.options[platform.selectedIndex].value;
var $search_filter=document.getElementById("search_filter").value;
if ($platform !== '0') {
document.location.href='http://www.' + $selectedplatform + 'domain.com/index.php?filter_name=' + $search_filter;
}
}
</script>
I try to modify all your code to make it more standard.
<head>
<script type="text/javascript">
function search_platform() {
var platform=document.getElementById("search_platform").value;
var search_filter=document.getElementById("search_filter").value;
if (platform !== '0') {
document.location.href='http://www.' + platform + '.domain.com/index.php?filter_name=' + search_filter;
}
}
</script>
</head>
<body>
<select id="search_platform">
<option value="0" selected="selected"><?php echo 'Select Platform'; ?></option>
<option value="1mmtform1">Platform 1</option>
<option value="platform2">Platform 2</option>
<option value="platform3">Platform 3</option>
</select>
<input type="text" name="filter_name" id="search_filter"/>
<img src="test.png" width="264" height="110" onclick="javascript:search_platform()" />
</body>