We Keep Coding

How to dynamically query a for-loop using url paramaters with axios and vuejs

I recently started to experiment with the WordPress Rest API and VueJs. I am trying to accomplish the following:
I use Axios to fetch an API URL (my WP REST API website) to build a list of posts. This works perfectly using the code(s) below.
Next (this is what I can't manage to make it work), I need to be able to 'filter' the for loop using url parameter queries. The parameter is 'country'. Thus, when clicking on a button 'France', e.g. the parameter: ?country=france should be added to the base URL.
Basically I tried to add simple functions on button clicks to these buttons (france & portugal). Please check my code to see what I tried so far.
HTML Code
<div class="row">
<button v-on:click="getFrance" id="france" class="m-2">France</button>
<button v-on:click="getPortugal" id="portugal" class="m-2">Portugal</button>
<form class="form-inline" v-on:submit.prevent="searchCountry">
<input type="text" id="nameInput" class="form-control mb-2 mr-sm-2 mb-sm-0" placeholder="Frankrijk" v-model="country">
<input type="submit" class="btn btn-primary"></input>
</form>
{{country}}
</div>
<div class="row">
<template>
<div class="col-6" v-for="post of posts" :key="post.id">
<div class="card">
<img v-bind:src="post.acf.header_picture.url" class="card-img-top" alt="Card image cap">
<div class="card-body v-html">
<h5>{{ post.title.rendered }}</h5>
</div>
<div class="card-footer">
<a><button class="btn-sm btn-warning">Read more</button></a>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
JS Code
var app = new Vue({
el: '#app',
data () {
return {
country : '',
posts : [] }
},
mounted () {
axios
.get('<<WP REST API URL>>', {
params: {
country: this.country
}
})
.then(response => {
this.posts = response.data
})
},
methods : {
getFrance: function(){
this.country = 'france'
},
getPortugal: function(){
this.country = 'portugal'
}
}
})
EDIT: I added the Response Data of the URL as requested. However, it's quite a big chunk of data, so let me know if this is not what you're looking for.
acf: Object
about_accommodation: "<ul>↵<li><strong>Tent</strong>: de tenten zijn voor 4 personen en bestaan uit 2 delen die beide geschikt zijn voor 2 personen. Naast het slaapdeel is er een plek waar de bagage kan liggen, wel zo fijn dus. Er is hier geen slaapmateriaal aanwezig, dus je dient zelf een matje, slaapzak en kussen mee te nemen. Het is mogelijk om zo’n ‘compartiment’ privé te boeken.</li>↵<li><strong>Sheddie</strong>: deze gezellige houten huisjes zijn een stuk comfortabeler dan de tenten en zijn geschikt voor 2 personen. Er is een groot bed aanwezig, waar 2 personen in kunnen slapen. Je kunt ter plekke beddengoed huren of zelf een slaapzak en kussen meenemen. Ook is er voldoende ruimte voor je bagage en zelfs een surfplank. Je kunt er net staan, wel zo makkelijk om je even op jezelf om te kleden voor de surfsessie. Ook deze kun je privé boeken.</li>↵<li><strong>Sheddie Deluxe</strong>: deze tenten zijn nog groter dan de sheddies en dus nog een stuk comfortabeler. Je kunt kiezen tussen 2 losse bedden of een groot 2-persoonsbed, ideaal voor koppels. Ook hier zijn matrassen aanwezig en heb je de optie om een beddengoedpakket bij te boeken. Indien je deze optie privé wilt, is dat mogelijk.</li>↵<li><strong>Tipi-Deluxe: </strong>De Tipi Deluxe is een prachtig ruimte tipi-tent met twee losse of 1 groot bed met een mooie aankleding. Dit is verblijven in stijl!</li>↵</ul>↵"
about_activities: "<ul>↵<li><strong>Party:</strong> 18+, dat betekent party! Vanaf het surfkamp kun je lopend naar tal van leuke barretjes die tot in de vroege uurtjes open zijn</li>↵<li><strong>Trips: </strong>tijdens jouw verblijf kun je deelnemen aan de daguitstap naar San Sebastian, een fantastische stad die zeker een bezoekje waard zijn. Ontdek de echte gastronomie die Spanje te bieden heeft</li>↵<li><strong>Yoga:</strong> kies voor de yogalessen voor de ideale ontspanning en een leuke afwisseling met het surfen. Dit is de beste manier om je spieren even helemaal bij te laten komen na een flinke inspanning in het water</li>↵<li><strong>Skate & Beach:</strong> ook naast het surfen is er van alles te doen. Cruise over de boulevard van Moliets en geniet van het vrije leven</li>↵</ul>↵"
about_facilities: Array(8)
about_guests: "<p>In het surfkamp vind je vooral Nederlandstaligen, de meesten tussen de 18 en de 25 jaar oud. De sheddies zijn perfect om als koppel of vrienden te verblijven maar ook solo reizigers weten een weg te vinden naar Surfblend Moliets</p>↵"
about_meals: "<ul>↵<li><strong>Eten:</strong> het halfpension is zeker aan te raden. Je zult 8 x ontbijten (incl. nadat je aankomt in het surfkamp na de busreis) en 5 x wordt er een divers en lekker diner geserveerd. Het hoogtepunt voor velen is de wekelijkse barbecue, gegarandeerd het begin van een mooie avond. In Zarautz zelf zijn er een aantal leuke opties voor lunch, maar voor ontbijt en diner is de maaltijd-optie aan te raden – wel zo makkelijk en het is ook nog eens heel erg lekker</li>↵<li><strong>Dieetwensen:</strong> het is geen probleem indien je een bepaalde dieetwens hebt. Geef dit van te voren even aan bij de kampleiding</li>↵<li><strong>Kookfaciliteiten:</strong> in het surfkamp zijn verder geen kookfaciliteiten aanwezig die door de gasten kunnen worden gebruikt</li>↵</ul>↵"
about_surf_conditions: "<ul>↵<li><strong>Beginners:</strong> beginnende surfers raden wij de cursus van 15 uur ten zeerste aan. Zeker in het begin is surfen een vrij lastig te leren sport, waarbij goede training vereist is.</li>↵<li><strong>Intermediate:</strong> intermediate surfers raden wij de cursus van 10 uur ten zeerste aan.</li>↵<li><strong>Gevorderd: </strong>gevorderde surfers kunnen ervoor kiezen om alleen gebruik te maken van het surfmateriaal.</li>↵</ul>↵"
about_surf_holiday: "<ul>↵<li><strong>Het kamp: </strong>dit surfkamp biedt werkelijk alles: surfen, veel fun, leuke activiteiten en uiteraard een flinke dosis party! Alle gasten zijn ten minste 18 jaar oud en hierdoor ontstaat er een leuke sfeer waar iedereen uit is op hetzelfde: een fantastische tijd hebben. Het prachtige surfstrand van Molietes bevindt zich op loopafstand van het surfkamp, ideaal dus. En ook de vele barretjes in het centrum kun je gemakkelijk bereiken. Ben jij klaar voor dé surfvakantie van 2020?</li>↵<li><strong>Moliets: </strong>dit Franse dorpje ademt surf, meer dan waar dan ook. In de zomer komen hier surfers van alle hoeken uit de wereld naartoe om de beroemde golven van Moliets te proberen. Ook is er een gezellige boulevard met enkele horecagelegenheden.</li>↵<li><strong>Vervoer: </strong>wat erg fijn is, is dat Moliets vanuit Nederland en België met de bus bereikbaar is. Zie onderaan deze pagina ‘vervoer’ voor meer informatie.</li>↵</ul>↵"
about_surf_lessons: "<ul>↵<li><strong>Surfen:</strong> je kunt kiezen uit de volgende surfpakketten:↵<ul>↵<li>Pakket S: 3 dagen surfles per week + gebruik surfmateriaal</li>↵<li>Pakket M: 5 dagen surfles per week + gebruik surfmateriaal</li>↵<li>Alleen gebruik surfmateriaal</li>↵<li>Er worden ook theorielessen gegeven</li>↵<li>Voor beginnende surfers raden wij Pakket L ten zeerste aan. Zeker in het begin is surfen een vrij lastig te leren sport, waarbij goede training vereist is</li>↵</ul>↵</li>↵<li><strong>Surfmateriaal:</strong> bij alle pakketten is het gebruik van het surfmateriaal (surfboard & wetstuit) inbegrepen in de prijs van het verblijf. Het is echter wel zo dat de gasten die surflessen volgen, voorrang krijgen op het surfmateriaal. Meestal levert dit geen problemen op en zeker ook buiten de lessen om kan er gewoon gesurft worden.</li>↵</ul>↵<p> </p>↵"
about_transport: "<ul>↵<li><strong>Surfbus: </strong>de bussen naar Moliets vertrekken op vrijdagmiddag vanaf Amsterdam, Utrecht, Den Bosch, Breda, Antwerpen en Gent. De vertrektijd zal liggen tussen 13:00 en 18:30 uur. Op de zaterdag van jouw vertrek zal de bus aan het einde van de middag terugrijden richting België en Nederland, waar je dan zondagochtend aankomt. Rijdt vanaf 21 juni t/m 15 september 2019 (vertrek vrijdagmiddag, terugkomst zondagochtend).</li>↵<li><strong>Eigen vervoer:</strong> het is geen probleem om met de auto naar camping Moliets te komen. Er zijn mogelijkheden om gratis te parkeren.</li>↵</ul>↵"
accommodation: "Gedeelde en privé tenten"
accommodation_type: "Surfkamp"
activities_gallery: Array(3)
add_ons: Object
alert_checkbox: Array(1)
alert_text: "<p>Er zijn nog enkele plekken beschikbaar voor deze zomer, wacht niet met boeken!</p>↵"
arrival: "Aankomst en vertrek op zaterdag"
availability: "Raakt spoedig volgeboekt"
average_age: "18 - 25"
carousel: Array(3)
check-in-check-out: (...)
country: "Frankrijk"
covid: true
etc.etc.

From my understanding, if you're filtering posts, it must be done on the API side, so you get all the "France" posts, don't get unnecessary info, and don't waste memory.
If you can't filter it on API side (but why send URL parameters then) and getting all the posts, you can create a method like to use it to filter posts:
filterPostsByCountry: function() {
return this.posts.filter(post => post.country === this.country);
}

send JSON or array to submit POST (jQuery -> PHP)

Good morning.
I'm stucked on this thing:
I'm doing a form (which send info to other page via submit button, post) which dynamically user can add some other form-groups with a button.
Ok, that's easy.
BUT the user is making something called "DPT" (work stuff) which have a table in my DB, and also have a "Function" (things to do) table. A DPT can have one or many Functions.
Function
---------
id int(4) AI
title VARCHAR(64) NOT NULL
description VARCHAR(256)
dpt int(4) --> FK
| 1..*
|
V 1
DPT
-----
id
name
(...)
So I have a <div> which I inflate with jQuery for making a panel and form inside it.
Why I did that? Because if a DPT can have one or many Functions I have to store the ID of the current Function I am creating.
Then I have a button for adding more functions, but I have to storage the ID of the function and the title and description of it.
So with jQuery I can dynamically add before the button of "Add function" a new form...
My idea was create a JSON and send it via PHP but have no idea where I have to send the info or where to return to...
I let you here my important code for doing the thing:
<div id="initialFunction" class="panel panel-default panel-body">
<?php
$nextID = mysqli_fetch_assoc(mysqli_query($con,"SELECT MAX(id_funcion) as siguiente_id from funcion"))['siguiente_id'];
?>
<button class="button btn-danger" type="button">
<span class="fa fa-minus">
</span>
</button>
</div>
<script>
var nextId = <?php echo $nextID?>
var arrayToPass = {}
$(function(){
$("#initialFunction").html('<div class="form-group">'+
'<label>Función a desarrollar <sup style="color:red">*</sup></label>'+
'<input class="form-control" name="funcion" type="text" placeholder="Función a desarrollar" maxlength="200" required>'+
'</div>'+
'<div class="form-group">'+
'<label>Tarea principal en esta función <sup style="color:red">*</sup></label>'+
'<textarea class="form-control" name="tarea" placeholder="Enumere las funciones de su puesto de trabajo comenzando por las más representativas, así como las tareas necesarias para el cumplimiento de las mismas" rows="3" required></textarea>'+
'</div>');
});
$("#bttn-add").click(function(){
$("#bttn-add-function").before(
'<div class="form-group">'+
'<label>Función a desarrollar <sup style="color:red">*</sup></label>'+
'<input class="form-control" name="funcion" type="text" placeholder="Función a desarrollar" maxlength="200" required>'+
'</div>'+
'<div class="form-group">'+
'<label>Tarea principal en esta función <sup style="color:red">*</sup></label>'+
'<textarea class="form-control" name="tarea" placeholder="Enumere las funciones de su puesto de trabajo comenzando por las más representativas, así como las tareas necesarias para el cumplimiento de las mismas" rows="3" required></textarea>'+
'</div>');
nextId++;
});
Can I return an array/json when I do click on the submit button and pass it through POST?
something like:
$("#guardar_dpt").click(function(){
return json_object
} )
?
I show you a what I am doing.
also the entire form:

It is possible. And simple. Here is example:
HTML:
<script src="https://unpkg.com/jquery"></script>
<form id="myForm" method="post">
<input type="text" name="first"><br>
<input type="text" name="last"><br>
<input type="submit" value="Send">
</form>
<p id="output"></p>
JS:
function parseAnswer (data) {
var content
content += 'Name: ' + data.first + '<br>'
content += 'Surname: ' + data.last
$('#output').text(Name)
}
$('#myForm').on( "submit", function (evt) {
var data = $(this).serialize()
evt.preventDefault()
$.post('any.php', data, parseAnswer)
})
PHP:
<?php
header("Content-type: application/json");
$first = $_POST['first'];
$last = $_POST['last'];
$arr = ['first' => $first, 'last' => $last];
echo json_encode($arr);
?>

Ajax request only works one time [duplicate]

This question already has answers here:
Event binding on dynamically created elements?
(23 answers)
Closed 6 years ago.
I have a select option which is working perfectly but only one time, the request does not executes again.
I think it's because of the 'onchange' event.
This is my ajax code :
jQuery(document).ready(function($) {
$('#referenceProduit').change(function(){
//on recupere la valeur de l'attribut value pour afficher tel ou tel resultat
var req=$('#referenceProduit').val();
//requête ajax, appel du fichier function.php
$.ajax({
type: "POST",
url: "include/php.php",
data: "referenceProduit="+req,
dataType : "json",
//affichage de l'erreur en cas de problème
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest + '--' + textStatus + '--' + errorThrown);
},
//function s'il n'y a pas de probleme
success:function(data){
//On affiche la réponse du serveur
$('.produit').empty();
$('.produit').prepend(data.produit);
$('input[name="designation"]').val(data.resDisplayForm.designation);
$('input[name="prix"]').val(data.resDisplayForm.prix);
}
});
});
});
HTML code :
<div class="form-group">
<label for="referenceProduit" class="col-sm-1 control-label">Reference</label>
<div class="col-sm-2">
<select class="form-control" name="referenceProduit" id="referenceProduit">
<option selected="selected" disabled="disabled">Choisir</option>
<?php foreach($lesProduits as $unProduit){?>
<option name="<?php echo $unProduit['id'];?>" value="<?php echo $unProduit['id'];?>"><?php echo $unProduit['reference']?></option>
<?php } ?>
</select>
</div>
</div>
<div class="form-group">
<div class="produit"></div>
</div><br/><br/>

You should map to
.on(eventType, selector, function)
example
$('#parentElement').on('change', '#referenceProduit', function)

I'm having an Issue with a simple HTML/jQuery page

I have been working on this problem for 3 days, and I still have no answer to this problem I'm facing, it must be simple I just can't figure it out.
I'm using HTML and jQuery for a simple jQuery/HTML page to navigate 3 pages.
the problem is that when I swipe between pages I have kind of layout flash, for the first second after I swipe I see the page resizing and showing the first page for a flash second, and then the page would be normal again.
Here is my code :
JS FIDDLE LIVE DEMO
var newsnum=10;
var i=1;
$("body").on("swipeleft",function(){
if (i<newsnum) {
i++;
$.mobile.changePage('#p'+i, {
allowSamePageTransition :true,
transition: "fade"});
}});
$("body").on("swiperight",function(){
if (i>1) {
i--;
$.mobile.changePage('#p'+i, {
allowSamePageTransition :true,
transition: "fade",
reverse: true });
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>
<div data-role="page" id="p1">
<img style="width:800px; height:200px" src="http://www.parismania.fr/wp-content/uploads/2013/01/Didot_Matuidi.jpg" class="img-responsive" > <br><h4 align="left" style="color:#E49B0F; padding-left:10px;"> 111111111 </h4> <div> <h5 style="padding-left:10px; padding-right:10px;"> Touchée à la cheville droite la semaine passée, la milieu de terrain Sandie Toletti (Montpellier) ne sera pas opérationnelle pour la Coupe du Monde au Canada (6 juin au 5 juillet). C'est sa coéquipière au MHSC Marina Makanza qui la remplace.<br\/><br\/>Communiqué de la FFF\ <br\/>Dimanche 3 mai dernier, lors du match de D1 féminine entre Juvisy et Montpellier, Sandie Toletti s’est blessée à la cheville droite.<br\/> <br\/>Les staffs médicaux du HSC Montpellier et de l’Equipe de France féminine ont constaté son indisponibilité pour une longue durée. D’un commun accord, ils ont laissé la milieu de terrain à la disposition de son club.<br\/>Retenue parmi les sept réservistes pour la prochaine Coupe du Monde féminine (6 juin - 5 juillet au Canada), elle est remplacée par Marina Makanza (HSC Montpellier).<br\/> <br\/>À l’exception des joueuses du Paris SG, qui disputeront jeudi la finale de la Ligue des Champions, les Tricolores entameront demain (lundi) au Centre National du Football (CNF) à Clairefontaine (Yvelines) leur préparation pour la Coupe du Monde de la FIFA.
Touchée à la cheville droite la semaine passée, la milieu de terrain Sandie Toletti (Montpellier) ne sera pas opérationnelle pour la Coupe du Monde au Canada (6 juin au 5 juillet). C'est sa coéquipière au MHSC Marina Makanza qui la remplace.<br\/><br\/>Communiqué de la FFF\ <br\/>Dimanche 3 mai dernier, lors du match de D1 féminine entre Juvisy et Montpellier, Sandie Toletti s’est blessée à la cheville droite.<br\/> <br\/>Les staffs médicaux du HSC Montpellier et de l’Equipe de France féminine ont constaté son indisponibilité pour une longue durée. D’un commun accord, ils ont laissé la milieu de terrain à la disposition de son club.<br\/>Retenue parmi les sept réservistes pour la prochaine Coupe du Monde féminine (6 juin - 5 juillet au Canada), elle est remplacée par Marina Makanza (HSC Montpellier).<br\/> <br\/>À l’exception des joueuses du Paris SG, qui disputeront jeudi la finale de la Ligue des Champions, les Tricolores entameront demain (lundi) au Centre National du Football (CNF) à Clairefontaine (Yvelines) leur préparation pour la Coupe du Monde de la FIFA.</h5></div>
</div>
<div data-role="page" id="p2">
<img style="width:800px; height:200px" src="http://www.paris-saint-germain.com/wp-content/uploads/2012/08/jalletcapitaine-480x280.jpg" class="img-responsive" > <br><h4 align="left" style="color:#E49B0F; padding-left:10px;"> 2222222222 </h4> <div> <h5 style="padding-left:10px; padding-right:10px;"> Touchée à la cheville droite la semaine passée, la milieu de terrain Sandie Toletti (Montpellier) ne sera pas opérationnelle pour la Coupe du Monde au Canada (6 juin au 5 juillet). C'est sa coéquipière au MHSC Marina Makanza qui la remplace.<br\/><br\/>Communiqué de la FFF\ <br\/>Dimanche 3 mai dernier, lors du match de D1 féminine entre Juvisy et Montpellier, Sandie Toletti s’est blessée à la cheville droite.<br\/> <br\/>Les staffs médicaux du HSC Montpellier et de l’Equipe de France féminine ont constaté son indisponibilité pour une longue durée.res entameront demain (lundi) au Centre National du Football (CNF) à Clairefontaine (Yvelines) leur préparation pour la Coupe du Monde de la FIFA.
Touchée à la cheville droite la semaine passée, la milieu de terrain Sandie Toletti (Montpellier) ne sera pas opérationnelle pour la Coupe du Monde au Canada (6 juin au 5 juillet). C'est sa coéquipière au MHSC Marina Makanza qui la remplace.<br\/><br\/>Communiqué de la FFF\ <br\/>Dimanche 3 mai dernier, lors du match de D1 féminine entre Juvisy et Montpellier, Sandie Toletti s’est blessée à la cheville droite.<br\/> <br\/>Les staffs médicaux du HSC Montpellier et de l’Equipe de France féminine ont constaté son indisponibilité pour une longue durée. D’un commun accord, ils ont laissé la milieu de terrain à la disposition de son club.<br\/>Retenue parmi les sept réservistes pour la prochaine Coupe du Monde féminine (6 juin - 5 juillet au Canada), elle est remplacée par Marina Makanza (HSC Montpellier).<br\/> <br\/>À l’exception des joueuses du Paris SG, qui disputeront jeudi la finale de la Ligue des Champions, les Tricolores entameront demain (lundi) au Centre National du Football (CNF) à Clairefontaine (Yvelines) leur préparation pour la Coupe du Monde de la FIFA.</h5>
</div>
</div>
<div data-role="page" id="p3">
<img style="width:800px; height:200px" src="http://img.modernghana.com/images/content/y17gx33wvr_191408935_15493.jpg" class="img-responsive" > <br><h4 align="left" style="color:#E49B0F; padding-left:10px;"> 3333333333 </h4> <div> <h5 style="padding-left:10px; padding-right:10px;"> Dimitri Payet affichait un grand soulagement après la victoire de son équipe à l'arraché face à Monaco. Le meneur de jeu de l'OM a avoué qu'à un moment de la rencontre, il se demandait même comment Marseille pourrait ne serait-ce que prendre un point.<br\/><br\/>« Honnêtement, à un moment, on a senti que ça allait être très compliqué, même d’égaliser, avouait le meneur de jeu de l’OM Dimitri Payet sur Canal Plus après la victoire renversante de son équipe face à Monaco dimanche soir (2-1, 36eme journée de L1). Mais contrairement à d’autres matchs où on dominait et où on se faisait contrer à la fin, là, on n’a peut-être pas été beaux à voir jouer mais on a su être efficaces. On ne va pas faire la fine bouche, on va savourer, parce que si on n’avait pas gagné ce soir, on pouvait dire adieu au podium. Eux (les supporters), on n’a rien à leur reprocher. On dit que c’est un public difficile, mais, cette année, malgré beaucoup de faux-pas de notre part, ils ont toujours été là. Ce soir encore, c’était plein. Et quand ça pousse comme ça, ça donne de l’énergie. »\ <br\/>« On dépend encore de Monaco »\ <br\/>« Les changements ? C’est le coach, c’est lui qui décide, nous on essaye de s’adapter au mieux, poursuivait l’ancien Stéphanois. Il y a eu beaucoup de critiques sur ça. Ce soir, ça marche et ça paye. On va savourer car c’est une victoire très importante. Malheureusement, on n’a pas encore notre destin entre les mains, on dépend encore de Monaco. On revient à la hauteur de Saint-Etienne, les derniers matchs vont être très importants, ça va être chaud.</h5> </div>
</div>

Can't make Bootstrap Modal data-attributes work

I spend data via data-attributes and I can not do it.
I found many examples in StackOverflow and followed the example of Bootstrap docs but can not get it to work.
The modal displays ok, but not load the data-attributes.
This is my code:
Button:
<a type='button' data-toggle='modal' data-target='#exampleModal' data-titulo='<?php the_title(); ?>' data-contenido='<?php echo strip_tags($contenido) ?>' data-enlace='<?php echo post_permalink($ID); ?>'><i class='flaticon-new67'></i></a>
The variables work ok. Looking at the source code, load correctly.
The Modal:
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="exampleModalLabel">Enviar Nota</h4>
</div>
<div class="modal-body">
<input id="titulo" type="text" name="titulo" value=""/>
<input type="text" name="contenido" value=""/>
<input type="text" name="enlace" value=""/>
</div>
</div>
</div>
</div>
Javascript:
$('#exampleModal').on('show.bs.modal', function(e) {
var titulo = $(e.relatedTarget).data('titulo');
var contenido = $(e.relatedTarget).data('contenido');
var enlace = $(e.relatedTarget).data('enlace');
$(e.currentTarget).find('.modal-body input[name="titulo"]').val(titulo);
$(e.currentTarget).find('.modal-body input[name="contenido"]').val(contenido);
$(e.currentTarget).find('.modal-body input[name="enlace"]').val(enlace);
});
What is wrong in the code?
This is the PHP´s button output:
<a type="button" data-toggle="modal" data-target="#exampleModal" data-titulo="Los secretos de los tambos rentables" data-contenido="Arturo Scheidegger es un especialista en producción lechera reconocido internacionalmente. Disertó en las jornadas Tambo Líder organizadas por CLAAS, Forratec y la marca CHT Hansen en Villa María. Frente a un grupo de productores de punta, el asesor internacional abogó por la medicina productiva, la calidad del forraje y la capacitación de los equipos de trabajo.
“El mínimo de vacas para que un tambo sea rentable es cada vez mayor”, aseguró Arturo Scheidegger en la jornada Tambo Líder que se realizó recientemente en Villa María, Córdoba, organizada por CLAAS, Forratec y la marca CHR Hansen a través de su distribuidor Villa Nueva. El especialista chileno fue el principal disertante de una reunión técnica en la que participaron establecimientos lecheros de distintas regiones del país pero con un denominador común: todos tienen un mínimo de 1.100 vacas en ordeño.
“Cuando comencé, hace casi 30 años, un tambo de 100 vacas era una lechería decentemente grande. Hoy el mínimo está por encima de las 500 vacas y a los productores que están por debajo de ese número les resulta difícil afrontar los costos de personal, de maquinaria, y de asesoramiento”, agregó Scheidegger. También comentó que en Estados Unidos ya se estima que sólo serán viables los tambos intensivos con más de 1.000 vacas en producción.
De todas formas, el especialista chileno consideró que la lechería mundial seguirá creciendo bajo los diferentes modelos de producción, tanto aquellos con base pastoril como los estabulados. Pero remarcó que existe una tendencia a que los sistemas intensivos de producción apunten a mayores escalas para lograr rentabilidad.
Estos comentarios quedaron avalados por los datos que a nivel internacional muestran que se reduce el número total de tambos pero crece el tamaño de los que permanecen en la actividad, basados en mayor número de vacas y con incorporación de nuevas maquinarias y mejores planteos forrajeros.
La presentación de Scheidegger se llamó “Secretos de la Estabulación”, e hizo hincapié en tres. El primero fue la `medicina productiva´, a la que adhiere y que comenzó en Estados Unidos alrededor de 1980 basada en una visión holística de la actividad lechera. “El principal objetivo de la medicina productiva es la salud económica y el bienestar del propietario del establecimiento”, indicó el doctor en ciencias veterinarias. “Para ello contamos con programas específicos que nos permiten realizar evaluaciones periódicas sobre la marcha de la producción del establecimiento. Estos sistemas nos alertan cuando nos estamos alejando de los objetivos para que pongamos en marcha las correcciones necesarias que nos permitan mantener en equilibrio la relación costo-beneficio de la actividad”.
El segundo secreto del asesor de establecimientos lecheros es la calidad del forraje “que tiene que ser buena ya que es la vía que tenemos para abaratar los costos de producción. Por lo tanto, nunca se termina de trabajar lo suficiente en calidad de forraje”. Y con ese marco puntualizó la necesidad de realizar una adecuada conservación de los forrajes, atendiendo cuidadosamente desde la siembra de los cultivos hasta el suministro a los animales.
Por último, enfatizó en la necesidad de armar equipos de trabajos capacitados y motivados. “Pude comprobar que tambos en iguales condiciones, de zona, asesor y sistema de producción, pueden mostrar resultados muy distintos según la capacidad y habilidad de su equipo de trabajo”.
“El desafío es mantener una actividad lechera eficiente, cuya rentabilidad le permita competir con otras producciones. Para ello, la gestión del equipo de trabajo es determinante”, resumió Scheidegger." data-enlace="http://saviacomunicacion.com.ar/test2014/sala_de_prensa/los-secretos-de-los-tambos-rentables/">