Use the onclick in the list of options

Question

Use the onclick in the list of options

Navigation

#1 by (2 votes)

0

I have the following html code drop-down list, with which I need to link some already designed reports

<label class="w3-text-teal"><b>Tipo de Reportes&vert;</b>
         <select name="Lista" class="w3-border">
           <option value="saab">--Seleccionar--</option>
           <option value="Ante" href="Reportes/ReportTecnico">Relacion de pqr Asociados a Tecnicos</option>
           <option value="Ante" href="Reportes/pdf_generar.php">Informe General Estados pqr</option>
         </select>
 </label>    

 <br>
 <br>

<button name="Generar" type="sumbit" onclick="">Generar Reporte</button>

I would like you to give me an idea of how to do it using the onclick event on the button

html5 html html-select

asked by Andrex_11 09.03.2018 в 05:18

source

1 answer

ListView cap to TextView Array From C # to Visual Basic

score 2 · Accepted Answer

First of all, comment that you should always look at the attributes of the HTML objects that you use. In this case, options does not support "href" as an attribute. This helps you make your page more correct and standard.

link

Then the first thing that should be changed is the HTML code of the select:

 <select  id="reportList" name="Lista" class="w3-border">
           <option value="saab">--Seleccionar--</option>
           <option value="ReportTecnico.php">Relacion de pqr Asociados a Tecnicos</option>
           <option value="pdf_generar.php">Informe General Estados pqr</option>
         </select>

We now have the value of the option the url of the report .

I have removed "/ Reports" because it seems that it is always the same and could be a variable within the javascript itself.

var reportUrl="/Reportes/";

The javascript function that should be called from the onclick of the button (I have removed the submit type because I do not see a form) would be of this type:

function generaReporte()
{

var reportList = document.getElementById("reportList");
if(reportList.selectedIndex!=0)
{
    var informe = reportList.options[reportList.selectedIndex].value;
  alert('Informe ' + informe);
}

}

Logically instead of doing alert you can do a window.open , location.href .. whatever you need.

Here is an example that works with both jquery and without:

link