Estoy adaptando un método para convertir un fichero JSON en CSV. El caso es que en una página HTML/PHP me funciona sin problema, pero cuando lo meto dentro de una modal, no se ejecuta el botón que hace la transformación de JSON a CSV. Esta es la función con la que cargo el fichero JSON en el primer textArea
<script type="text/javascript">
$(function(){
$("#uno").click( function(){
var TXT_URL = "data/observa.json";
$.ajax({
url : TXT_URL,
dataType: "text",
success : function (data){
$("#txt1").html(data);
}
});
});
});
</script>
<div class="modal" id="modal-name">
<div class="modal-sandbox"></div>
<div class="modal-box">
<div class="modal-header">
<div class="close-modal">✖</div>
<h1>Simple modal box</h1>
</div>
<div class="modal-body">
<div class = "tableJSON">
<div style="float:left;height:auto;width:100%;"><button id="uno" class="buttom">Generate File</button></div>
<div class="tabJS01">
<div class = "tabJS02">
<textarea class="textArea" id="txt1" rows="10"></textarea>
</div>
<div class = "tabJS02">
<textarea class="textArea" id="txta" rows="10" wrap="off"></textarea>
</div>
</div>
<div class = "tabJS03">
<div class = "tabJS02">
<input type="button" class="btn buttom" value="Convert GeoJson To CSV" title="Convert GeoJson To CSV" onclick="runit(document.getElementById('txt1').value)">
<br><form class="formCSV">
Output Separator:
<label><input type="radio" name="outsep" id="outSepComma" value="," checked="checked"> ,</label>
<label><input type="radio" name="outsep" id="outSepSemicolon" value=";"> ;</label>
<label><input type="radio" name="outsep" id="outSepSemicolon" value=":"> :</label>
<label><input type="radio" name="outsep" id="outSepPipe" value="|"> |</label>
<label><input type="radio" name="outsep" id="outSepTab" value=" " onclick="this.value='\t'"> Tab</label>
<br />
<label><input id="chkCsvQuotes" type="checkbox" /> Wrap values</label>
<label><input type="checkbox" id="chkNoBreaks" value="Y"> Suppress Line Breaks</label>
<label><input id="chkCsvHeader" type="checkbox" checked="checked" /> Include header</label>
</form><br>
</div>
<div class = "tabJS02">
<div class="tabJS04">
<input type="text" size="15" id="fn" placeholder="nameFile" class="form-control" title="Enter filename without extension" /> .csv
</div>
<div>
<input type="button" value="Save to Disk" class="btn buttom" onclick="saveFile(document.getElementById('txta').value,'csv')" />
</div>
</div>
</div>
</div>
</div>
</div>
Ese es la función que llama el botón
<script type="text/javascript">
function assignText(s) {
document.getElementById('txt1').value = s;
};
function runit(s) {
var delimiter = radiovalue(document.forms[0].outsep);
var nobreaks = document.getElementById('chkNoBreaks').checked;
if (delimiter == "o") delimiter = document.getElementById("outSepOtherVal").value;
if(s.trim()!="") {
try{
document.getElementById('txta').value = geoJsonToCsv(s, delimiter, (document.getElementById('chkCsvHeader')).checked,(document.getElementById('chkCsvQuotes')).checked, nobreaks);
} catch(e) {
alert("Your GeoJson input is not valid");
}
CSV.isFirstRowHeader = (document.getElementById('chkCsvHeader')).checked;
CSV.parse(document.getElementById('txta').value);
//document.getElementById('diva').innerHTML = csvToTable(CSV, (document.getElementById('chkCsvHeader')).checked, false,false);
}
};
Despúes hay una serie de librerías externas, pero que puedo obviar. Como decía si monto esto en una página aparte, funciona sin problema, el problema es al ejecutar el botón con el que transforma el JSON en CSV.
Una ayudita, por favor! gracias
he hecho los cambios que me proponías en la función que llama al JSON, pero sigue sin funcionar la conversión a CSV, la llamada a la función runit en el botón:
<input type="button" class="btn buttom" value="Convert GeoJson To CSV" title="Convert GeoJson To CSV" onclick="runit(document.getElementById('txt1').value)">