Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

221
Vistas
if string contains url anywhere convert it into link using javascript

I have a modal in which I am getting data from DB. But I need to know if there is any URL in Description anywhere convert it to anchor tag. It is working only for 1st position URL but my paragraph contains too many URL.

function showFeedModal(newsID, type, dateTimeOfNews) {

  var $modal = $('#DetailModal');
  var $modalHeader = $modal.find('div.modal-header');
  var $modalBody = $modal.find('div.modal-body');

  var urlCheck = new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_])?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?");

  var img = '/Dashboard/img/icons/icon-widget/';
  $modalHeader.find('div.color-black').text(dateTimeOfNews);

  $.get('/Home/NewsModal?pk_NewsID=' + newsID + '&DateTimeOfNews=' + dateTimeOfNews + '&type=' + type, function (response) {

    img += response.NewsSourceModel.SourceIconFile;
    $modalBody.find('p.mb-3').text(response.NewsSourceModel.SourceName);
    $modalBody.find('div.news-icon').html('<img class="img-fluid" src="' + img + '" alt="">');
    $modalBody.find('div.detail').html('<div class="description font-big fw-bold" data-toggle="modal" data-target="#DetailModal">' + response.Headline + '</div>');

    //if NewsContent contains url anywhere convert it to hyperLink
    if (urlCheck.test(response.Description)) {
      $modalBody.find('div.news-content').html('<p>' + response.Description.replace(urlCheck.exec(response.Description)[0], "<a href='" + urlCheck.exec(response.Description)[0] + "' target='_blank'>" + urlCheck.exec(response.Description)[0] + "</a>") + '</p>');
    }
    else
      $modalBody.find('div.news-content').html('<p>' + response.Description+ '</p>');


    if (response.Link != null)
      $modalBody.find('div.news-content').append('<p><a href="' + response.Link + '" target="_blank">View Details...</a></p>');
    $modal.modal();
  })

}
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You already have made most of the work, you just need to use replaceAll() instead of replace() to replace all the links, and not only the first one:

function showFeedModal(newsID, type, dateTimeOfNews) {

  var $modal = $('#DetailModal');
  var $modalHeader = $modal.find('div.modal-header');
  var $modalBody = $modal.find('div.modal-body');

  var urlCheck = new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_])?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?");

  var img = '/Dashboard/img/icons/icon-widget/';
  $modalHeader.find('div.color-black').text(dateTimeOfNews);

  $.get('/Home/NewsModal?pk_NewsID=' + newsID + '&DateTimeOfNews=' + dateTimeOfNews + '&type=' + type, function (response) {

    img += response.NewsSourceModel.SourceIconFile;
    $modalBody.find('p.mb-3').text(response.NewsSourceModel.SourceName);
    $modalBody.find('div.news-icon').html('<img class="img-fluid" src="' + img + '" alt="">');
    $modalBody.find('div.detail').html('<div class="description font-big fw-bold" data-toggle="modal" data-target="#DetailModal">' + response.Headline + '</div>');

    //if NewsContent contains url anywhere convert it to hyperLink
    if (urlCheck.test(response.Description)) {
      $modalBody.find('div.news-content').html('<p>' + response.Description.replaceAll(urlCheck.exec(response.Description)[0], "<a href='" + urlCheck.exec(response.Description)[0] + "' target='_blank'>" + urlCheck.exec(response.Description)[0] + "</a>") + '</p>');
    }
    else
      $modalBody.find('div.news-content').html('<p>' + response.Description+ '</p>');


    if (response.Link != null)
      $modalBody.find('div.news-content').append('<p><a href="' + response.Link + '" target="_blank">View Details...</a></p>');
    $modal.modal();
  })

}
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda