2

De acuerdo a esta pregunta (link) tengo un JSON con valores que extraigo de elementos HTML con la diferencia de usar <textarea> en lugar de <select> y cuyos valores se obtienen de textos de archivos de MS Word. Construyo mi JSON de la siguiente manera:

var trads = $("select[name='personal[]']").map(function(){return $(this).val();}).get();
var num_trad = trads.length;

var text = new Array();
var values = new Array();
var approved = new Array();

for (var i=1; i<=num_trad; i++){
  text.push($("textarea[name='lang_"+i+"[]']").map(function(){return $(this).val();}).get());
  values.push($("input[name='words_"+i+"[]'").map(function(){return $(this).val();}).get());
  approved.push($("input[name='approved_"+i+"[]'").map(function(){return $(this).val();}).get());
}

var lenguajes=10;

var sjson=`[`;
for (var i=0; i<num_trad; i++){
  sjson+=`{"personal": "${trads[i]}","content": [`;
  for(var h=0; h<lenguajes&&langs[i][h]!=undefined; h++){
    sjson+=`{"text":"${langs[i][h]}",`;
    sjson+=`"words":"${values[i][h]}",`;
    sjson+=`"approved":"${approved[i][h]}"}`;
    if(langs[i][h+1]!=undefined)
      sjson+=',';      
 }
 sjson+=']}';      
 if(i+1<num_trad)
   sjson+=',';
}
sjson+=']';
console.log(sjson);

Sin embargo, algunos documentos de Word contienen texto con comillas y al incorporarlo en el JSON me presenta un error, por ejemplo:

[{
   "personal": "1001",
   "content": [{
      "text": "Los lenguajes que mencionó son: "Español e Inglés"",
      "words": "302",
      "approved": "yes"
   }, {
      "text": "Ella dijo: "Me gustan los helados"",
      "words": "180",
      "approved": "no"
   }]
}]

El cual es un JSON no valido.

¿Cómo puedo solucionarlo?

Agradeceré su ayuda.

2
  • Sabes cuales son los textos que llegan en comillas ? si sabes extactamente cuales son los texto , lo que puedes hacer es remplazar las comillas dobles de los texto por comillas simpres de esta forma: "text": "Ella dijo: 'Me gustan los helados'", Commented el 22 ago. 2019 a las 16:27
  • Lamentablemente no se que textos tendrán comillas :/
    – NekoLopez
    Commented el 22 ago. 2019 a las 16:35

1 respuesta 1

3

Existen 2 opciones:

1. Remplazar las comillas dobles con comillas simples:

Para esto puedes usar split() y join() de la siguiente forma:

cadena.split('"').join("'");

resultado:

[{
   "personal": "1001",
   "content": [{
      "text": "Los lenguajes que mencionó son: 'Español e Inglés'",
      "words": "302",
      "approved": "yes"
   }, {
      "text": "Ella dijo: 'Me gustan los helados'",
      "words": "180",
      "approved": "no"
   }]
}]

Puedes ver como funciona en el siguiente código:

var trads = $("select[name='personal[]']").map(function(){return $(this).val();}).get();
var num_trad = trads.length;

var langs = new Array();
var values = new Array();
var approved = new Array();

for (var i=1; i<=num_trad; i++){
      langs.push($("select[name='lang_"+i+"[]']").map(function(){return $(this).val();}).get());
      values.push($("input[name='words_"+i+"[]'").map(function(){return $(this).val();}).get());
      approved.push($("input[name='approved_"+i+"[]'").map(function(){return $(this).val();}).get());
}

var lenguajes=2;

var sjson=`[`;
for (var i=0; i<num_trad; i++){
  sjson+=`{"personal": "${trads[i]}","content": [`;
  for(var h=0; h<lenguajes&&langs[i][h]!=undefined; h++){
    sjson+=`{"language":"${langs[i][h].split('"').join("'")}",`;
    sjson+=`"words":"${values[i][h]}",`;
    sjson+=`"approved":"${approved[i][h]}"}`;
    if(langs[i][h+1]!=undefined)
      sjson+=',';      
  }
  sjson+=']}';      
  if(i+1<num_trad)
    sjson+=',';
}
sjson+=']';
console.log(sjson);
.divs{float:left;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="personal[]">
     <option value="1001">Mark</option>
     <option value="1002">Rose</option>
    </select>
    
<div style="clear:both;">
 <div class="divs">
    <select name="lang_1[]">
     <option value='Los lenguajes que mencionó son: "Español e Inglés"'>English</option>
     <option value="Spanish">Spanish</option>
    </select>
 </div>
 <div class="divs">
    <input name="words_1[]" value="302">
    <input name="approved_1[]" value="yes">
 </div>
</div>

<div style="clear:both;">
  <div class="divs">
    <select name="lang_1[]">
     <option value="English">English</option>
     <option value="Spanish" selected>Spanish</option>
    </select>
  </div>
  <div class="divs">
    <input name="words_1[]" value="180">
    <input name="approved_1[]" value="no">
 </div>
</div>

<hr style="clear: both;">
<select name="personal[]">
     <option value="1001">Mark</option>
     <option value="1002" selected>Rose</option>
    </select>
    
<div style="clear:both;">
 <div class="divs">
    <select name="lang_2[]">
     <option value="English">English</option>
     <option value="Spanish" selected>Spanish</option>
    </select>
 </div>
 <div class="divs">
    <input name="words_2[]" value="236">
    <input name="approved_2[]" value="yes">
 </div>
</div>

<hr style="clear: both;">

2. Remplazar las comillas dobles y agregar una barra invertida:

Para esto también puedes usar split() y join() de la siguiente forma:

cadena.split('"').join('\\\"');

resultado:

[{
   "personal": "1001",
   "content": [{
      "text": "Los lenguajes que mencionó son: \"Español e Inglés\"",
      "words": "302",
      "approved": "yes"
   }, {
      "text": "Ella dijo: \"Me gustan los helados\"",
      "words": "180",
      "approved": "no"
   }]
}]

La ventaja de este método es que se mantendrán las comillas dobles al mostrar el texto.

Puedes ver como funciona en el siguiente código:

var trads = $("select[name='personal[]']").map(function(){return $(this).val();}).get();
var num_trad = trads.length;

var langs = new Array();
var values = new Array();
var approved = new Array();

for (var i=1; i<=num_trad; i++){
      langs.push($("select[name='lang_"+i+"[]']").map(function(){return $(this).val();}).get());
      values.push($("input[name='words_"+i+"[]'").map(function(){return $(this).val();}).get());
      approved.push($("input[name='approved_"+i+"[]'").map(function(){return $(this).val();}).get());
}

var lenguajes=2;

var sjson=`[`;
for (var i=0; i<num_trad; i++){
  sjson+=`{"personal": "${trads[i]}","content": [`;
  for(var h=0; h<lenguajes&&langs[i][h]!=undefined; h++){
    sjson+=`{"language":"${langs[i][h].split('"').join('\\\"')}",`;
    sjson+=`"words":"${values[i][h]}",`;
    sjson+=`"approved":"${approved[i][h]}"}`;
    if(langs[i][h+1]!=undefined)
      sjson+=',';      
  }
  sjson+=']}';      
  if(i+1<num_trad)
    sjson+=',';
}
sjson+=']';
console.log(sjson);
.divs{float:left;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="personal[]">
     <option value="1001">Mark</option>
     <option value="1002">Rose</option>
    </select>
    
<div style="clear:both;">
 <div class="divs">
    <select name="lang_1[]">
     <option value='Los lenguajes que mencionó son: "Español e Inglés"'>English</option>
     <option value="Spanish">Spanish</option>
    </select>
 </div>
 <div class="divs">
    <input name="words_1[]" value="302">
    <input name="approved_1[]" value="yes">
 </div>
</div>

<div style="clear:both;">
  <div class="divs">
    <select name="lang_1[]">
     <option value="English">English</option>
     <option value="Spanish" selected>Spanish</option>
    </select>
  </div>
  <div class="divs">
    <input name="words_1[]" value="180">
    <input name="approved_1[]" value="no">
 </div>
</div>

<hr style="clear: both;">
<select name="personal[]">
     <option value="1001">Mark</option>
     <option value="1002" selected>Rose</option>
    </select>
    
<div style="clear:both;">
 <div class="divs">
    <select name="lang_2[]">
     <option value="English">English</option>
     <option value="Spanish" selected>Spanish</option>
    </select>
 </div>
 <div class="divs">
    <input name="words_2[]" value="236">
    <input name="approved_2[]" value="yes">
 </div>
</div>

<hr style="clear: both;">

Puedes comprobar (con https://jsonlint.com/ por ejemplo) que en ambos casos los json son validos.

Espero te sirva, saludos.

2
  • 1
    Genial, me salvaste la vida! :D
    – NekoLopez
    Commented el 22 ago. 2019 a las 17:20
  • @NekoLopez de nada, que tengas buen día. Commented el 22 ago. 2019 a las 17:21

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.