JSLink and Javascript client object model

Hi,

I am trying out the JS Link and REST API model. I can use only javascript client object model.

1) Can the JSLink code and javascript client object model using REST service exist in same file?

I tried a small example, but the UI is not coming properly. The existing Title label is not moved, and a new label is shown. The save and cancel buttons are shown on top of the customizations.

UI looks as below:

Title*

Save  Cancel

Title inputcontrol Searchbutton

Below is the code which was tried:

function () {

    // Create object that have the context information about the field that we want to change it's output render
    var formTemplate = {};
    formTemplate.Templates = {};
    formTemplate.Templates.View = viewTemplate;

    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(formTemplate);

})();

// This function provides the rendering logic for the Custom Form
function viewTemplate(ctx) {

    var formTable = "".concat("<table width='100%' cellpadding='5'>","<tr>","<td><div>Title</div></td>","<td><div>{{TitleCtrl}}</div></td>","<td><input type='button' value='Search' onclick=\"SPClientForms.ClientFormManager.SubmitClientForm('{{FormId}}')\" style='margin-left:0' ></td>","</tr>","</table>");


    //Replace the tokens with the default sharepoint controls
    formTable = formTable.replace("{{TitleCtrl}}", getSPFieldRender(ctx, "Title"));
    formTable = formTable.replace("{{FormId}}", ctx.FormUniqueId);

    return formTable;
}

//This function code set the required properties and call the OOTB (default) function that use to render Sharepoint Fields
function getSPFieldRender(ctx, fieldName)
{
    var fieldContext = ctx;

    //Get the filed Schema
    var result = ctx.ListSchema.Field.filter(function( obj ) {
        return obj.Name == fieldName;
    });

    //Set the field Schema  & default value
    fieldContext.CurrentFieldSchema = result[0];
    fieldContext.CurrentFieldValue = ctx.ListData.Items[0][fieldName];

    //Call  OOTB field render function
    return ctx.Templates.Fields[fieldName](fieldContext);
}

How to re-arrange the UI properly. what i am trying to do is:

Title* inputcontrol searchbutton

savebutton cancelbutton

Also, on click on search button, is it possible to call a javascript client object model function by passing the value of the title field.

How to fix this?

Thanks