jquery: Ajax: how to prepend html string recieved with new line characters

Question

I have url which gives html string as repsonse

Examples: the following is the html

<div class="form-group">
    <label for="id_password">
        Password
    </label>
    <input class="form-control" id="id_password" maxlength="128" name="password" placeholder="Password" required="" title="" type="text"/>
</div>
<div class="form-group">
    <label for="id_last_login">
        Last login
    </label>
    <input class="form-control" id="id_last_login" name="last_login" placeholder="Last login" title="" type="text"/>
</div>
<div class="form-group">
    <div class="form-check">
        <input class="form-check-input" id="id_is_superuser" name="is_superuser" type="checkbox">
            <label class="form-check-label" for="id_is_superuser" title="Designates that this user has all permissions without explicitly assigning them.">
                Superuser status
            </label>
            <small class="form-text text-muted">
                Designates that this user has all permissions without explicitly assigning them.
            </small>
        </input>
    </div>
</div>

it sent as a string like with

<div class="form-group"><label for="id_password">Password</label><input type="text" name="password" maxlength="128" class="form-control" placeholder="Password" title="" required id="id_password"></div>
<div class="form-group"><label for="id_last_login">Last login</label><input type="text" name="last_login" class="form-control" placeholder="Last login" title="" id="id_last_login"></div>
<div class="form-group"><div class="form-check"><input type="checkbox" name="is_superuser" class="form-check-input" id="id_is_superuser"><label class="form-check-label" for="id_is_superuser" title="Designates that this user has all permissions without explicitly assigning them.">Superuser status</label>
    <small class="form-text text-muted">Designates that this user has all permissions without explicitly assigning them.</small>

</div></div>

I have the following form i which i have to insert this html code recieved

    <form action="/url/to/submit/" method="post" class="form" id="id_form">
        <!-- Here i have to insert he html i get from ajax -->
        <button type="submit" class="btn btn-primary">
          Submit
        </button>
    </form>

I am trying the following:

        $.ajax({
            url: "/get_form_fields",
            type: 'GET',
            success: function(res) {
                $("#id_form").prepend(res)
            },
            error: function(err) {
                console.log(err)
            }
        })

What i see is the form element is removed and it adds a <pre>html code of the fields</pre>

How can i do this

Answer 1

等待大神答复