elcaiaimar

Hi, I having problems when I execute (from a JS file) an onclick function by the class that is into an append of another JS file. My code is this: JS File1: var user_tmpl = $('<div />') .addClass('user') .append('<strong/>').find('strong').addClass('titulo').html(item.titulo) .append('<a href="#buscamedioModal" role="button" class="btn btn-danger deletebuscamedio" data-toggle="modal" id=' + item.gid + ' data-name=' + item.titulo + '>Eliminar</a>') .parent(); JS File2 (call): // Configuraciones Generales var boton_eliminar_buscamedio = ".deletebuscamedio"; // Clase // Fin de configuraciones $(document).on('ready',function(){ $(boton_eliminar_buscamedio).on('click',function(e){ e.preventDefault(); var Pid_medio = $(this).attr('id'); alert(Pid_medio); var name_buscamedio = $(this).data('name'); But it seems that it can't run the function because doesn't find the class "deletebuscamedio". Does anyone how to do this? Thank you in advance!

Hello, what it happens is that when I try to save the attributes on scopes, they are undefined. There aren't errors in my browser console. After your answer, How could I get the file information and save it in scopes. My main problem is with javascript. Thank you very much!

Hello everybody, I'm new in angular so sorry if my question is ridiculous. I have a drag and drop file area and when I put a file I put his details (attributes: name, size, type) on inputs disabled because I don't want that users can change them. All of that is a form, so I want to save this with angular in scopes. Here my code: <div ngf-drop ngf-select ng-model="files" class="drop-box" ngf-drag-over-class="'dragover'" ngf-multiple="true" ngf-allow-dir="true" accept="{{acceptSelect}}" ngf-pattern="pattern" required>Arrastre y suelte su archivo aquí</div> <div ngf-no-file-drop>File Drag/Drop is not supported for this browser</div> <br> <div class="preview"> <div>Detalles del video: <div style="clear:both" class="videodetails" ng-repeat="file in files"> <div class="form-group"> <label class="col-md-4 control-label" for="fileName">{{ "Nombre" }}</label> <div class="col-md-5"> <input id="fileName" type="text" ng-model="file.name" disabled> </div> </div> <div class="form-group"> <label class="col-md-4 control-label" for="fileSize">{{ "Tamaño" }}</label> <div class="col-md-5"> <input id="fileSize" type="text" ng-model="file.size" disabled> </div> </div> <div class="form-group"> <label class="col-md-4 control-label" for="fileType">{{ "Tipo" }}</label> <div class="col-md-5"> <input id="fileType" type="text" ng-model="file.type" disabled> </div> </div> JavaScript: $scope.file = function (data) { $scope.file.fileName = data.name; $scope.file.fileSize = data.size; $scope.file.fileType = data.type; } I don't know what I'm doing wrong. Any help? Does anybody know to fix it? Thank you very much!

Hello! I have a map in my website and when I click on it, if there is a feature, it shows its information. This information is written by an innerHTML and currently it looks like that: if (feature) { var objeto = feature.getProperties(), propiedades; var propiedades; content.innerHTML = ""; for (propiedades in objeto){ content.innerHTML += propiedades + ':' + objeto[propiedades] + "<br />"; } return container.style.display = 'block'; } else { return container.style.display = 'none'; } So the info is shown ok but a little untidy. So I would like to show this info with a table. propiedades contains the name of the data and objeto[propiedades] their values. Could anybody tell me how to do it or give me an example please? Thank you in advance!

Hello, I've a problem when I try to send variables (django variables) from html to javascript. My variables contain coordinates, I mean, they are decimals, and when I receive them in the javascript and I show them in console, I've got only the no decimal part of the coordinates. This is my code: Template: <td><button onclick="window.to('{{p.coorx}}','{{p.coory}}')" data-coorx="{{p.coorx}}" data-coory="{{p.coory}}">Ver Pozo</button></td> Javascript: window.to = function(coorx,coory) { var coorx = parseFloat(coorx); var coory = parseFloat(coory); console.log(coorx); console.log(coory);} I'm sure that my error is in the way in what I establish the parameters to send in HTML. I've tried several choices as: <td><button onclick="window.to(" + {{p.coorx}} + "," + {{p.coory}} + ")" data-coorx="{{p.coorx}}" data-coory="{{p.coory}}">Ver Pozo</button></td> But then it gives me an error: Uncaught SyntaxError: Unexpected token } Would anybody know how to solve this problem? Greetings and thank you very much in advance!

Now, I click a button to remove db registers so I don't want to click another button to execute the map script. I think that the best way would be to click in the delete button, then shows an alert saying removed and automatically execute the script. For that, I've thought in execute it from the code above, if it was possible.

Ok, thanks for your clarification. Just a question, How could I run the script from my code? I've seen that you can do it with events but I dont want to use any button to do it. Thank you again!

Hello, I'm trying to reload only a script instead of entire page. And I want to apply it in an ajax script. How could I do that? My web contains a map(script of openlayers) and I put data into the map. So when I remove this data by a button I would like reload only the map. Here is my code. It only shows an alert if the object has been removed or not: // Autor: @jqcaper// Configuraciones Generalesvar nombre_tabla_pozos = "#tabla_pozos"; // idvar nombre_boton_eliminar_pozo = ".deletepozo"; // Clasevar nombre_formulario_modal_pozo = "#frmEliminarpozo"; //idvar nombre_ventana_modal_pozo = "#pozoModal"; // id// Fin de configuraciones$(document).on('ready',function(){ $(nombre_boton_eliminar_pozo).on('click',function(e){ e.preventDefault(); var Pid_pozo = $(this).attr('id'); var name_pozo = $(this).data('name'); $('#modal_idPozo').val(Pid_pozo); $('#pozo_name').text(name_pozo); }); var options_pozo = { success:function(response) { if(response.status=="True"){ alert("¡Object removed!"); var idPozo = response.pozo_id; var elementospozo= $(nombre_tabla_pozos+' >tbody >tr').length; if(elementospozo==1){ location.reload(); }else{ $('#tr'+idPozo).remove(); $(nombre_ventana_modal_pozo).modal('hide'); } }else{ alert("¡There was an error when remove!"); $(nombre_ventana_modal_pozo).modal('hide'); **RELOAD SCRIPT }; } }; $(nombre_formulario_modal_pozo).ajaxForm(options_pozo);}); Thank you very much!

That is! It works! Sorry but I didn't find the solution. Thank you very much!

Sorry, but I'm trying everything and don't get anything. Can you tell me how you would do it with my code? I'm still a newbie in JS Thank you for your fast answers!

I've tried to put that: var myVar = 1;var tramosSource = new ol.source.ServerVector({ format: new ol.format.GeoJSON(), loader: function(extent, resolution, projection) { var url = 'http://localhost:808...wfs?service=WFS' + '&version=1.1.0&request=GetFeature&typename=cia:tramos&PROPERTYNAME=gid_cuenca_id&CQL_FILTER=gid_cuenca_id="myVar"&' + 'outputFormat=text/javascript&format_options=callback:tramosloadFeatures' + '&srsname=EPSG:3857'; $.ajax({ url: url, dataType: 'jsonp' }); }, projection: 'EPSG:3857' }); But I have the same problem: Uncaught SyntaxError: Unexpected token < <ows:ExceptionReport xmlns:ows="http://www.opengis.net/ows" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="1.0.0" xsi:schemaLocation="http://www.opengis.net/ows http://localhost:8080/geoserver/schemas/ows/1.0.0/owsExceptionReport.xsd"> <ows:Exception exceptionCode="InvalidParameterValue"> <ows:ExceptionText>Illegal property name: myVar</ows:ExceptionText> </ows:Exception></ows:ExceptionReport>

Hello! I'm working in a viewer with openlayers and with geoserver and I want to filter layers by a variable. I'm not going to ask anything about geoserver nor openlayers. My problem is about put variables in a url. To obtain geoserver layers from openlayers you have to call them by a url and to filter them you have to use CQL_FILTER. (Filter to shows only what the user wants). My viewer works fine if I put a simple value to filter: (gid_cuenca_id is a db column) var imbornalesSource = new ol.source.ServerVector({ format: new ol.format.GeoJSON(), loader: function(extent, resolution, projection) { var url = 'http://localhost:8080/geoserver/cia/wfs?service=WFS' + '&version=1.1.0&request=GetFeature&typename=cia:imbornales&PROPERTYNAME=gid_cuenca_id&CQL_FILTER=gid_cuenca_id=1&' + 'outputFormat=text/javascript&format_options=callback:imbornalesloadFeatures' + '&srsname=EPSG:3857'; $.ajax({ url: url, dataType: 'jsonp' }); }, projection: 'EPSG:3857' }); However, if I try to put a variable in the url, I receive an error: Uncaught SyntaxError: Unexpected token <I wanted to know if there is any way to put the variable's value as if it was a simple value. var myVar = 1;var tramosSource = new ol.source.ServerVector({ format: new ol.format.GeoJSON(), loader: function(extent, resolution, projection) { var url = 'http://localhost:8080/geoserver/cia/wfs?service=WFS' + '&version=1.1.0&request=GetFeature&typename=cia:tramos&PROPERTYNAME=gid_cuenca_id&CQL_FILTER=gid_cuenca_id=myVar&' + 'outputFormat=text/javascript&format_options=callback:tramosloadFeatures' + '&srsname=EPSG:3857'; $.ajax({ url: url, dataType: 'jsonp' }); }, projection: 'EPSG:3857' }); Thank you very much!!

Hello, first of all, thank you for your answer. I've been looking for examples and I've found a code. I've tried to change it to adapt it to my URL but I always receive the same: null Could you help me with my URL? http://localhost:8000/edicioncuenca/obra=2/cuenca=1/ function getParameter(paramName) { var searchString = window.location.search.substring(1), i, val, params = searchString.split("/"); for (i=0;i<params.length;i++) { val = params[i].split("="); if (val[0] == paramName) { return val[1]; } }return null;var cuenca=getParameter("cuenca");alert(cuenca); Thank you again!

Hello, I'm working in a website development with django and I need to send a parameter to a script. On my web, I send parameters through the URL on this way: I put the href in which {{obra.id}} is the object received from views.py href="/edicionobra/obra{{obra.id}}/"> At the url I take that object as parameter to go to one page or another, according its value, url(r'^edicionobra/obra(?P<id_obra>.*)/$','demo.apps.obras.views.EdicionObra', name='edicionobra'), However, I would like to take that parameter to use it in a script, but I don't know how to do it. Would anybody know how to solve this? Thank you very much!

I fix it! I put css('display', 'table-row'); and it looks well!

No, I mean that the values of the table elements are very close, not pagination links. I want to say that before putting JS code for pagination the table shows each value under its column, and after, all them are very close and only under one column (codpozo). I'm having a look at the JS code and I've seen this: /hide all children elements of content div, get specific items and show them $('.paginacion').children().css('display', 'none').slice(start_from, end_on).css('display', 'block'); Could be that? Its the only thing related with css in JS code.. I've tried to change it for another display but I don't know what display could fix it Any ideas? Thank you very much!

Hello, I'm doing a pagination to my table but I'm having a problem with elements position. Pagination works fine but elements are really very close, as you can see in the attached images. I've tried to change things but nothing happens. Does anyone know how to solve it? I put my code below. Thank you very much! CSS: #page_navigation a{ padding:3px; border:1px solid gray; margin:2px; color:black; text-decoration:none}.active_page{ background:darkblue; color:white !important; width:100%;} JS: $(document).ready(function(){ //how much items per page to show var show_per_page = 5; //getting the amount of elements inside content div var number_of_items = $('.paginacion').children().size(); //calculate the number of pages we are going to have var number_of_pages = Math.ceil(number_of_items/show_per_page); //set the value of our hidden input fields $('#current_page').val(0); $('#show_per_page').val(show_per_page); //now when we got all we need for the navigation let's make it ' /* what are we going to have in the navigation? - link to previous page - links to specific pages - link to next page */ var navigation_html = '<a class="previous_link" href="javascript:previous();">Prev</a>'; var current_link = 0; while(number_of_pages > current_link){ navigation_html += '<a class="page_link" href="javascript:go_to_page(' + current_link +')" longdesc="' + current_link +'">'+ (current_link + 1) +'</a>'; current_link++; } navigation_html += '<a class="next_link" href="javascript:next();">Next</a>'; $('#page_navigation').html(navigation_html); go_to_page(0); });function previous(){ new_page = parseInt($('#current_page').val()) - 1; //if there is an item before the current active link run the function if($('.active_page').prev('.page_link').length==true){ go_to_page(new_page); } }function next(){ new_page = parseInt($('#current_page').val()) + 1; //if there is an item after the current active link run the function if($('.active_page').next('.page_link').length==true){ go_to_page(new_page); } }function go_to_page(page_num){ //get the number of items shown per page var show_per_page = parseInt($('#show_per_page').val()); //get the element number where to start the slice from start_from = page_num * show_per_page; //get the element number where to end the slice end_on = start_from + show_per_page; //hide all children elements of content div, get specific items and show them $('.paginacion').children().css('display', 'none').slice(start_from, end_on).css('display', 'block'); /*get the page link that has longdesc attribute of the current page and add active_page class to it and remove that class from previously active page link*/ $('.page_link[longdesc= + page_num +]').addClass('active_page').siblings('.active_page').removeClass('active_page'); //update the current page input field $('#current_page').val(page_num);} Template: <!-- the input fields that will hold the variables we will use --> <input type='hidden' id='current_page' /> <input type='hidden' id='show_per_page' /> <div id="tab1" class="tab active"> {% if results %} <table class="table table-hover" id="tabla_productos"> <thead> <tr> <th>Codpozo</th> <th>Coor X</th> <th>Coor Y</th> <th>Tipo</th> </tr> </thead> {% for p in results %} <tbody class="paginacion"> <tr id="tr{{p.id}}"> <td>{{ p.codpozo }}</td> <td>{{ p.coorx }}</td> <td>{{ p.coory }}</td> <td>{{ p.tipo }}</td> {% if user.is_authenticated and user.is_staff %} <td><a href="#myModal" role="button" class="btn btn-danger delete" data-toggle="modal" id="{{p.id}}" data-name="{{p.codpozo}}">Eliminar</a></td> {% endif %} </tr> </tbody> {% endfor %} </table> <div id='page_navigation'></div> {% else %} <h2>No existen pozos</h2> {% endif %} </div>

Hello, I have a problem in my website. Recently, I'm using tabs to show my information but this is changing the place of some elements in my web. I would like to know how I can solve this. I've created and attached a little .html with .css where I show what happens with my tabs. You will see two tabs with information and two buttons (imbornales and tramos). Both buttons should be under the tabs, but imbornales appears on the right side. And when I open some tab, both buttons are hidden. I think it's a problem with the position: absolute; I've tried to change it but the tabs behaviour is not the same. Any ideas? Thank you very much! pestanias.css pestanas.html

Hello everybody! I' ve several forms in my website but they don't show as I want. I'm using Django (python) and my form is the next: <form name="form2" action="/edicioncuenca/" method="POST"> {% csrf_token %} {{form.as_p}} <input type="submit" name="formsewer" value="Add sewer"> </input> </form> The result is a vertical form (with much space on the right side). I want to get a form in horizontal position. I mean, I would like to have a form occupying all the space. Is this possible with css? How could I do this? Thank you very much!

Hello everybody! I'm working in a cartographic viewer which has several buttons with JS code. I would like to know how could I introduce a register in a postgis db using JS code too. I mean, I want to click in a button, fill all the fields (columns of the table) and then click on accept to save the register. Is it possible to do? Could anybody help me please? Thank you a lot!

I'm working with openlayers 3. I have a map with several JS buttons and this code is from one of them.

Hello, I have a button which exports a map in png format. Everything is ok: I click it and save the image. However, if after do this, I pass my mouse over the button (without click), the map works very slowly, sometimes even the map and firefox is blocked. Here my code: if ('download' in button) { button.addEventListener('click', function() { map.once('postcompose', function(event) { var canvas = event.context.canvas; button.href = canvas.toDataURL('image/png'); button.download = 'mapa.png'; }); map.renderSync(); }, false); } else { var info = document.getElementById('no-download'); /** * display error message */ info.style.display = ''; } I think that the problem would be solved if the function finished after click the button and save the image. I' ve noticed that when I click on the button for first time, my pointer looks normal but after this first time, when I pass over the button, the pointer becomes as if it was a url. How could I solve this? Thank you very much!

It works! Thank you very much!!

Could you give me an example? I'm trying it and it doesn't work yet. Thank you again!

I have several properties and if I remove the concatenation I only get the last property of the feature. But thanks for your response!