[JavaScript][HTML] Wartość jednego pola zależna od tego co w innym polu. Opcje

[politowski]

Witam zrobiłem sobie taki formularz do wprowadzania informacji o profilach społecznościowych na stronie i potrzebuje pomocy bo utknąłem.
https://jsfiddle.net/xvyu34u0/5/
Chodzi o to żeby dodać do tego formularza opcję weryfikacji adresów url.

Jak fragment tekstu wpisanego w formularz będzie zawierał 'twitter.com' to chciałbym aby w polu 'Short Title' pojawiło się 'Twitter' ikonka globusa zmieniła się na fa-twitter, jak 'instagram.com' to pole 'Short Title' dostanie wartość 'Instagram' ikonka zmieni się na fa-instagram itd.

Mógłbym to pewnie w JS zrobić jakimiś ifem ale tych reguł będzie więcej więc było by masę ifów, jak to ogarnąć prościej?
Na razie wymyśliłem sobie że zrobię taką tablicę:

Kod

var socialServices = {
    'facebook.com' : {
        'title' : 'Facebook',
        'icon' : 'fa-facebook'
    },
    'twitter.com' : {
        'title' : 'Twitter',
        'icon' : 'fa-twitter'
    },
    'instagram.com' : {
        'title' : 'Instagram',
        'icon' : 'fa-instagram'
    },
};

tylko nie wiem jak ogarnąć chodzenie po tablicy i sprawdzanie jak formularz zawiera facebook.com to podstaw wartość klucza title dla facebook.com w inpucie www_label[] i wartość icon zamiast 'fa-globe'

[viking]

https://prophp.pl/article/28/propagacja_i_d...en_w_javascript
Po kliknięciu + podlicz ilość. Wygląda jakbyś coraz bardziej czekał na gotowy kod.

[politowski]

https://prophp.pl/article/28/propagacja_i_d...en_w_javascript
Po kliknięciu + podlicz ilość. Wygląda jakbyś coraz bardziej czekał na gotowy kod.

Skądże znowu nie czekam na gotowca, aczkolwiek z nich najlepiej mi się uczyć i zrozumieć działanie. Jak widzisz to nie jest tak że Twój kod został w 100% przepisany i czekam na kolejne gotowe rozwiązania. Działam w oparciu o kod który podałeś ale go zmodyfikowałem, próbuje coś robić samemu, i jak mi nie wychodzi to dopytuje.
JS nie ogarniam jeszcze aż tak bardzo, szybciej bym to zrobił w PHP, mam już nawet gotowy kod który zwraca mi json z tablicą w zależności od tego co jest w $_POST, ale wolałbym to zrobić bez AJAXa, tylko w JS/jQuery

[PHP] pobierz, plaintext 
// $post_data - dane przesyłane metodą POST
$post_data = 'https://www.instagram.com/explore/tags/annalewandowska/';
$socialServices = array(
	'facebook' => array(
		'regexp' => '#https?\://(?:www\.)?facebook\.com/(\d+|[A-Za-z0-9\.]+)/?#im',
		'icon' => 'fa-facebook',
		'title' => 'Facebook'
		),
	'twitter' => array(
		'regexp' => '#https?://(?:www\.)?twitter\.com/(\d+|[A-Za-z0-9\.]+)/?#im',
		'icon' => 'fa-twitter',
		'title' => 'Twitter'
		),
	'instagram' => array(
		'regexp' => '#https?://(?:www\.)?instagram\.com/(\d+|[A-Za-z0-9\.]+)/?#im',
		'icon' => 'fa-instagram',
		'title' => 'Instagram'
		),
	);
 
foreach ($socialServices as $value) {
	if(preg_match($value['regexp'], $post_data)){
		$data[] = array ('title'=> $value['title'], 'icon' => $value['icon']);
	}
}
 
if(!isset($data)){
	$data[] = array ('title'=> '', 'icon' => 'fa-globe');
}
header('Content-Type: application/json');
echo json_encode($data);
[PHP] pobierz, plaintext