2016-10-07 5 views
-1

Я пытаюсь показать форму динамически в соответствии с запросом.Добавить/удалить элемент html динамически

HTML

<label for="Type" class="required">Type</label> 
<br> 
<input id="f01" name="fieldid[]" type="hidden" value="23"> 
<input class="23" id="01" required="1" name="type" type="checkbox" value="g_magic"><span> G magic</span> 
<div> 
    <div id="div0g_magic"></div> 
</div> 
<input id="f02" name="fieldid[]" type="hidden" value="23"> 
<input class="23" id="02" required="1" name="type" type="checkbox" value="four_five"><span> Four five</span> 
<div> 
    <div id="div0four_five"></div> 
</div> 
</div> 

JAVASCRIPT

$("#01").on("change", function() { 
    var valueid = $("#01").val(); 
    var fieldid = $("#f01").val(); 
    if ($(this).is(":checked")) { 
    send(valueid, fieldid); 
    } else { 
    $("#div0" + valueid).empty(); 
    } 
}); 

function send(valueid, fieldid) { 
    $.ajax({ 
    url: '/echo/js/?js=hello%20world!', 
    success: function (response) { 

     $("#div0" + valueid).html(response.responseText); 

    }, 
    error: function (response) { 
     $("#div0" + valueid).html(response); 
    } 
    }); 
} 

$("#02").on("change", function() { 
    var valueid = $("#02").val(); 
    var fieldid = $("#f02").val(); 
    if ($(this).is(":checked")) { 
    send(valueid, fieldid); 
    } else { 
    $("#div0" + valueid).empty(); 
    } 
}); 

function send(valueid, fieldid) { 
    $.ajax({ 
    url: '/echo/js/?js=hello%20JS!', 
    success: function (response) { 

     $("#div0" + valueid).html(response.responseText); 

    }, 
    error: function (response) { 
     $("#div0" + valueid).html(response); 
    } 
    }); 
} 

CSS

.required:after { 
    color: #e32 !important; 
    content: ' * ' !important; 
    display: inline !important; 
} 
+1

Где мой код? –

+0

Ваш код – Tanmay

+0

Вы забыли включить ссылку своего кода в свой вопрос – xzegga

ответ

-2

Удаление содержимого HTML из элемента HTML

document.getElementById("element_id").innerHTML="" 

Добавление содержимого HTML в HTML-элемент

document.getElementById("element_id").innerHTML="<p>This is a new content</p>" 
-1

Я не могу видеть свой код, так что я не могу быть полностью уверен в этом, но это звучит, как вы хотите, чтобы динамически показать/скрыть форму или формы в зависимости от запроса. Это довольно легко выполнить с помощью jQuery. Вы могли бы использовать этот код:

$("#element-id").hide(); 

или

$("#element-id").show(); 

Где # элемент-идентификатор идентификатор элемента, который вы хотите, чтобы показать/скрыть. Если вы хотите, чтобы избежать идентификаторов или скрыть сразу несколько элементов, вы можете дать элементы класса, как «элемент-класс», а затем вы будете использовать:

$(".element-class").hide(); 

Если это не то, что вы искали выполнить, пожалуйста, обновите/комментарий и, надеюсь, кто-то может помочь больше!

0

способ отправить() создание конфликт. Введите другое имя для функции send() в функции изменения.

Смежные вопросы