PUC 2.0

We have a news builder page that creates news items that appear under our News & Events section. These can also be linked under an Academic Department. In addition to this you can link the news item under a non-academic department. But this select list does not have set options. So I wanted a way for the user to quickly add a new non-academic department without having to leave the page, and without having to reload.

A folder is used as the create location, and jQuery is used to post both the asset builder for the folder, and for the news item.

→ Take a look at the video: Add create location w/ Ajax

Use some jQuery POST code.

  function createAssetFolder() {

  $("#createdFolderLoad").show().html('<span id=\"hideFolder\"><img
  src="./?a=16336" /></span>');

  var folderName = $("#folder_0_220").val();

  SQ_FORM_ERROR_CONTAINED = false;

  $.ajax({

  type: "POST",

  data: "19303_ASSET_BUILDER_ACTION=create&19303_ASSET_BUILDER_CREATE_TYPE=

  folder&asset_action=create_custom&asset_ei_screen=details&sq_link_path=
&sq_preview_url=&folder_0_220=" + folderName + "&sq_lock_release=0",

  url: "./?a=19303/?",

  success: function(html){

  $("#createdFolder").append($(html).find("#ajaxResultFolder"));

  $("#non_academic").append("<option value=\"" +
  folderItemId + "\">" + folderName + "</option>");

  $("#hideFolder").hide();

  }

  });

}

We have to use the .find function so that it will only return the div that we want, which contains some "Created" page information:

$("#createdFolder").append($(html).find("#ajaxResultFolder"));

We also have to update the select list, with our newly created option, making sure to add the newly created asset ID and the newly created asset name:

$("#non_academic").append("<option value=\"" + folderItemId + "\">" + folderName + "</option>");

A variable is set on the "Created" page with the new asset ID. This is brought in when we get our thank you results:

var folderItemId = %created_assetid%;

Make sure to add a "submit" button with our function:

<input type="button" id="folderSave" onclick="createAssetFolder();" value="Save" />

And after all this, our new folder are created, and our selection list has been dynamicly updated with our new create location!

Remember that we are NOT nesting this asset builder into our News Item asset builder, we are only refering to it when we are posting, and sending it the nessisary data.

Posted by Nic Hubbard at 10:42 PM

Tags: admin tools, ajax, asset builder