FW/1框架：如何仅返回Ajax数据而不渲染完整视图？

FW/1默认会根据action匹配对应视图进行渲染，要实现仅返回数据，你可以通过以下两种方式修改后端函数，同时配合前端异步请求来完成：

方法一：直接返回序列化的JSON数据 #

FW/1会识别到action函数直接返回的非空值，自动跳过视图渲染流程。将查询到的员工数据序列化为JSON，设置响应头后返回即可：

public any function checkempid(struct rc = {}) {
    var employeeid = rc.employeeid;
    var employee = variables.activeidentificationService.checkempid(employeeid);
    
    // 设置响应内容类型为JSON
    request.webRequest.setResponseHeader( "Content-Type", "application/json" );
    // 返回序列化后的JSON数据，FW/1会直接输出内容，不渲染视图
    return serializeJson( employee );
}

方法二：设置skipView标志手动输出数据 #

如果需要保留rc变量的使用，可以通过request.skipView = true告诉FW/1跳过视图渲染，再手动输出JSON数据：

public any function checkempid(struct rc = {}) {
    var employeeid = rc.employeeid;
    rc.employee = variables.activeidentificationService.checkempid(employeeid);
    
    // 禁用视图渲染
    request.skipView = true;
    // 设置响应头
    request.webRequest.setResponseHeader( "Content-Type", "application/json" );
    // 输出序列化后的员工数据
    writeOutput( serializeJson( rc.employee ) );
}

前端配合：用AJAX异步请求 #

原来的onblur如果触发页面跳转或表单提交，必然会导致整页渲染，需要改成AJAX异步请求，示例代码如下：

// 假设员工ID输入框id为employeeid，展示数据的div为employeeInfo
document.getElementById('employeeid').addEventListener('blur', function() {
    const empId = this.value;
    if (!empId) return;
    
    fetch('/你的控制器名称/checkempid', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
        body: `employeeid=${encodeURIComponent(empId)}`
    })
    .then(res => res.json())
    .then(employeeData => {
        // 根据返回的数据更新页面指定区域
        const infoDiv = document.getElementById('employeeInfo');
        infoDiv.innerHTML = `
            <p>姓名：${employeeData.name}</p>
            <p>部门：${employeeData.department}</p>
        `;
    })
    .catch(err => console.log('请求出错：', err));
});

修改完成后，输入框失去焦点时会异步请求接口，获取纯JSON数据后更新页面局部内容，不会触发整页渲染。

内容的提问来源于stack exchange，提问作者spacerobot